css - Float and margin -
i need know why following code:
<!doctype html> <html>     <head>         <title></title>         <style type="text/css">             *             {                 margin:0px;                 padding:0px;             }             #right             {                 float:right;             }             #content             {                 margin-top:20px;             }         </style>     </head>     <body>         <div id="right">a</div>         <div id="content">b</div>     </body> </html>   applies 20px margin top @ #right div.
two things missing: 1) clear:right; within #content. 2) widths need specified able apply clear:right without div's stacking.
<html>     <head>         <title></title>         <style type="text/css">             *             {                 margin:0px;                 padding:0px;             }             #right             {                 float:right;                 width:24%;                 border:1px solid red;             }             #content             {                 margin-top:20px;                 width:74%;                 clear: right;                 border:1px solid aboue;             }         </style>     </head>     <body>         <div id="right">a</div>         <div id="content">b</div>         <div style="clear:both;"></div>     </body> </html>   i've added borders easier view.
Comments
Post a Comment