Visualizzazione dei risultati da 1 a 2 su 2
  1. #1
    Utente di HTML.it L'avatar di garlick
    Registrato dal
    Dec 2001
    Messaggi
    385

    Altezza delle colonne in un layout

    Ciao, stavo leggendo gli articoli sui layout e ho provato a fare questa pagina con un layout a 3 colonne:


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Documento senza titolo</title>

    <style type="text/css">

    body{
    font-family:Verdana, Arial, Helvetica, sans-serif;
    font-size:9px;
    height: 400px;
    text-align: center;/*centra in IE 5.x */ }

    div#container{
    width: 760px;
    height: 100%;
    margin: 0px auto; /*centra negli altri browsers*/
    text-align: left; /*ripristina l' allineamento*/

    }
    div#header{
    width: 760px;
    height: 70px;
    background-color: #000000;
    }
    div#nav{
    float:left;
    width: 130px;
    padding: 10px;
    background-color:#33CCFF;
    }

    div#extra{
    float:right;
    width: 130px;
    padding: 10px;
    background-color:#33CCFF}

    div#content{
    margin: 0 150px;
    padding: 10px;
    background-color:#E6E6E6;
    }

    div#footer{
    clear:both;
    background-color:#000000}



    </style>

    </head>

    <body>

    <div id="container">

    <div id="header"></div>
    <div id="nav">prova</div>
    <div id="extra">prova</div>
    <div id="content">Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
    Cras massa lacus, tempor sit amet, dignissim quis, consequat vitae, lectus.
    Cras blandit. Curabitur elementum sodales quam. Nulla id pede.
    Phasellus ultrices, sapien non aliquet tempus, odio enim accumsan ante,
    nec pharetra ipsum magna molestie nulla.</div>
    <div id="footer">a</div>
    </div>
    </body>
    </html>
    Come mai però l'altezza delle due colonne laterali non diventa la stessa di quella centrale, che dipende dalla lunghezza del testo inserito?

    Volevo poi sapere una cosa: ho letto anche del box model hack, ma ho visto facendo altre prove che inserendo:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">

    il box model viene interpretato correttamente da IE. E' vero?

    Grazie

  2. #2
    IE interpreta "correttamente" (si veda la sua proprietà hasLayout ) quando è inserito un doctype di tipo Strict. per il problema delle colonne la soluzione è creare un immagine di 760 x 10 pixel ripartita in tre distinte aree di colore e da inserire nel contenitore come background e con ripetizione verticale (repeat-y). altrimenti le colonne laterali non si allungheranno uniformemente, perchè la loro lunghezza dipende dal contenuto.

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.