• User Newbie

    3 div allineati in un altro div

    la mia struttura deve essere questa:

    un div container con clear:booth, quindi altezza dimensionabile

    poi devo avere al suo interno altri 3 div con altezze diverse ma allineati tutti in alto uno a fianco all'altro, suppongo con float:left

    [HTML]
    body{background-color:White;width:100%;font:normal normal normal 14px "Arial"}
    #container{width:1000px; min-height:500px; text-align:center; border:1px solid black;margin:0 auto;height:auto;overflow:hidden; clear:both}
    #container2{width:1000px; text-align:center; border:10px solid red; height:500px; overflow:hidden; clear:both}
    #header{position:absolute;width:250px; border:1px solid blue}
    #navigation{width:250px;margin-left:0px; border:1px solid red}
    #images{position:absolute; margin:0 0 0 251px; width:298px;border:1px solid green}
    #content{ position:absolute; margin:0 0 0 550px;width:450px;margin-top:0px; border:1px solid maroon}
    #footer{width:1000px; border:1px solid yellow}
    [/HTML]

    [HTML]
    <body>

    <form id="form1" runat="server">

    <div id="container">

    <div id="Container2">

    <div id="header">
        <div id="Logo" >
        
        </div>
    
        <div id="navigation">
        
        </div>
    
    </div>
    
    <div id="images">
    image
    </div>
    
    <div id="content">
    
    
    </div>
    
    
    
    
    </div>
    

    </div>

    <div id="footer">

    </div>
    <div class="clr"></div>

    </form>
    </body>
    [/HTML]


  • User

    Non capisco qual'è il tuo problema... non ti si allineano?

    Se è così mi sembra di aver notato ad occhio che dai un bordo di 1px a div di 1000px. quindi straSbordano essendo i bordi esterni.


  • User

    Concordo, l'unica cosa a cui devi prestare attenzione è la width (e ovviamente i margin e padding correlati).
    La somma delle width dei 3 div interni non dovrà mai superare o addirittura essere uguale a quella del div contenitore.
    Per il resto il ragionamento del div padre con fload:both oppure none è corretto, così come i float left dei div interni.