IALweb Homepage
Forum Home Forum Home > Programmazione > Programmazione > HTML - XML
  New Posts New Posts RSS Feed - [RISOLTO][CSS] Problemi con impaginazione
  FAQ FAQ  Forum Search   Events   Register Register  Login Login


REGISTRATEVI su IALWeb forum!

Topic Closed[RISOLTO][CSS] Problemi con impaginazione

 Post Reply Post Reply
Author
Message
Xavier View Drop Down
Veterano
Veterano
Avatar

Joined: 23/Giu/2006
Location: Italy
Status: Offline
Points: 3776
Direct Link To This Post Topic: [RISOLTO][CSS] Problemi con impaginazione
    Posted: 13/Dic/2006 at 10:36
Buon giorno a tutti quanti voi!!
Ho un problema con l'impaginazione tramite css.

Di seguito vi mostro il mio css:

html,body{
margin: 0;
padding:0
}

body{
font-family: arial,sans-serif;
font-size: 12px;
text-align: center
}

div#footer{
    background: #FFFFFF;
    text-align: center;
    padding: 12em 0 0 0;
}

div#container{
position:relative;
width: 760px;
margin: 0 auto;
text-align: left;
/*border-left: 1px solid #36c;
border-right: 1px solid #36c;*/
border: solid;
border-width: 1px;
border-color: #36c;
background-color: white;
}

/*stili generici, su header e footer*/
div#header{
height: 80px;
background-color:#FFFFFF;
color: #ff0;
text-align: center;
}

div#navigation{
    width: 100px;
    float: left;
    text-align: left;
    text-decoration: none;
    border-right: 1px solid #36c;
    padding: 1 0 1 2em;
}

div#content{
/*margin-right: 13em;
*/padding: 1em;
background-color: #fff
}


/*---------------------------------------------------------- ------------------*/
/*Stili per la navigazione        & amp; nbsp;         & amp; nbsp;         & amp; nbsp;         & amp; nbsp;         & amp; nbsp;         & amp; nbsp;  */
/*---------------------------------------------------------- ------------------*/
div#navigation ul{
margin: 0 0 20px;
padding: 0;
list-style-type: none
}

div#navigation ul a{
display:block;
width: 90px;
color: #0066CC;
font-weight:bold;
text-decoration: none
}

div#navigation ul a:hover{
background-color: #ffcb31;
color: #0066CC;
display:block;
line-height:14px;
padding-left:5px;
}

div#navigation ul a#activelink{
color: #0066CC;
text-decoration: none
}


quando lo utilizzo in una pagina, di seguito vi mostro un esempio di pagina:
<?php
//attivo la sessione
session_start();
?>

<html>
<head>
<title>LogIn</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<link rel="stylesheet" type="text/css" href="template/my_css.css">

</head>

<body>

<div id = "container">
    <div id = "header">
    
    <table border = "0" align="center">
        <tr>
             <td><img class = "contenitore" src="immagini/banner.jpg"></td>
        </tr>
    </table>   
   
    </div>
   
    <div id="navigation">
        <ul>
             <li><a id="activelink" href="#">Home</a></li>
             <li><a href="#">Pillole</a></li>
             <li><a href="#">Contenuti</a></li>
             <li><a href="#">Grafica</a></li>
             <li><a href="#">Linguaggi</a></li>
             <li><a href="#">Webdesign</a></li>
             <li><a href="#">Software</a></li>
                         <li><a href="#">Contenuti</a></li>
             <li><a href="#">Grafica</a></li>
             <li><a href="#">Linguaggi</a></li>
             <li><a href="#">Webdesign</a></li>
             <li><a href="#">Software</a></li>
        </ul>
    </div>
   
    <div id = "footer">
    </div>

    <table border = "0" align="center">
        <tr>
             <td><img class = "contenitore" src="immagini/downpage.jpg"></td>
        </tr>
    </table>    
   
    </div>



</div>

</body>
</html>


Questa mi da problemi in visualizzazione. Ossia:
- In explore funziona tutto alla perfezione l'immagine di testa e quella di piede mi si visualizzano una in cima e l'altra alla fine del documento, mentre in firefox questa mi viene spostata di vianco al menu a meno che non inserisca una serie di <br> nel div content.

- Il bordo della pagina in explore viene visualizzato correttamente, mentre in firefox, viene visualizzato fin sotto alla immagine di testa e poi mi taglia il menu.

ora mi chiedo come mai no funziona, qualcuno mi sa dare una mano??

come faccio a far si che se aggiungo qualche cosa collegamento al menu, anche la pagina e il relativo bordo attorno a tutta la pagina mi viene visualizzato e si allunghi automaticamente..

sperando di essere stato abbastanza chiara ..

ringrazio anticipatamente


Edited by Xavier
Per richieste inviatemi MP

Usate SEMPRE il tasto cerca e siate chiari nelle discussioni

<a href="http://www.ideabile.it" rel="nofollow">MY WE
Back to Top
Sponsored Links


Back to Top
Xavier View Drop Down
Veterano
Veterano
Avatar

Joined: 23/Giu/2006
Location: Italy
Status: Offline
Points: 3776
Direct Link To This Post Posted: 15/Dic/2006 at 14:02
Lunedý poster˛ il codice css nuovo ed un esempio di pagina, in modo tale che se qualche utente si trovasse nella mia stessa situazione, trovi aiuto in questo 3d.


ciao ciao
Per richieste inviatemi MP

Usate SEMPRE il tasto cerca e siate chiari nelle discussioni

<a href="http://www.ideabile.it" rel="nofollow">MY WE
Back to Top
Xavier View Drop Down
Veterano
Veterano
Avatar

Joined: 23/Giu/2006
Location: Italy
Status: Offline
Points: 3776
Direct Link To This Post Posted: 27/Dic/2006 at 11:51
Scusate.. per l'attesa ma il codice Ŕ questo ..

/*
STILE DEDICATO ALL'IMPAGINAZIONE DELLA PAGINA
PIU I VARI STILI PER LA NAVIGAZIONE
*/

html,body{
margin:0;
padding:0;
}

body{
font: 12px arial,sans-serif;
text-align:center;
}

div#header{
    height: 67px;
    color: #79B30B;
    background-image: url(../immagini/banner.jpg);
}

/*
FORMATAZIONE DI LAYOUT
*/
div#container{
text-align:left;
}

div#navigation{
    background: #FFFFFF;
}

div#footer{
    height: 25px;
    background-image: url(../immagini/downpage.jpg);
}

/*
STILI DI LAYOUT 2 di 2
*/
div#header{
margin-top: 10px;
width : 100%;
}

div#container{
width:750px;
margin:0 auto;
border: solid;
border-width: 1px;
border-color: #36c;
background-color: white;
}

div#content_index{
float:center;
width:750px;
}

div#content{
float:right;
width:570px;
}
 
div#navigation{
float:left;
width:167px;
padding-left: 5px;
}

div#footer{
clear:both;
width:100%;
margin-bottom: 10px;
}

/*---------------------------------------------------------- ------------------*/
/*Stili per la navigazione        & nbsp;         & nbsp;         & nbsp;         & nbsp;         & nbsp;   */
/*---------------------------------------------------------- ------------------*/
div#navigation ul{
margin: 0 0 20px;
list-style-type: none;
padding-left: 5px;
}

div#navigation ul a{
display : block;
width: 155px;
padding-left: 5px;
}

div#navigation ul a:hover{
display : block;
width: 155px;
background-color: #ffcb31;
padding-left: 5px;
border : 1px solid #c00;
}

div#navigation ul a#activelink{
color: #0066CC;
text-decoration: none;
}

.textfot{
    font: 9px arial,sans-serif;
    background-color: #ffcb31;
    text-decoration: none;
    color: #0066CC;
    float : left;
    margin-top : 20px;
    margin-bottom: 0px;
    margin-left: 0px;
    height : auto;
}

con la relativa pagina html

html>

<head>
<title>LogIn</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link rel="stylesheet" type="text/css" href="template/impaginazione.css">
<link rel="stylesheet" type="text/css" href="template/input.css">
<link rel="stylesheet" type="text/css" href="template/varie.css">

</head>

<body>
<div id="container">
    <div id="header">
    </div>
        <div id="wratter">
             <div id="content_index">
            </div>
        </div>
         <div id="footer">
        </div>
</div>

</body>
</html>
Per richieste inviatemi MP

Usate SEMPRE il tasto cerca e siate chiari nelle discussioni

<a href="http://www.ideabile.it" rel="nofollow">MY WE
Back to Top
 Post Reply Post Reply
  Share Topic   

Forum Jump Forum Permissions View Drop Down

Forum Software by Web Wiz Forums® version 10.17
Copyright ©2001-2013 Web Wiz Ltd.

This page was generated in 0,078 seconds.