html - Why my inside divs went oustide the container div? -


when zoomed browser, date , apa div went outside container div. how keep date/apa div still inside container when zoomed? sorry asking simple question. beginner.

<!doctype html>     <html>     <head>         <title></title>         <link rel="stylesheet" type="text/css" href="testeffect.css"/>     </head>       <body>           <div id="header">               <div id="container">                 <div id="date">                     <p>18 jamadilawal 1434h<br> saturday, 30th march 2013<br><p>                 </div>                  <div id="apa">                 <p>18 jamadilawal 1434h<br> saturday, 30th march 2013<br><p>                 </div>              </div>            </div>      </body> </html>   *{margin: 0 auto;}  #header{     height: 50px;     width: 100%;     background-color: black; }  p{     font-family: garamond;     font-size: 18px;     color: white; }   #container{  height: 50px;  width: 800px;  position: absolute;  left: 20% }   #apa{     position: absolute;     left: 200px;     width: 200px;     height: 50px;     background-color: brown;     left: 420px;  }   #date{     position: absolute;     left: 200px;     width: 200px;     height: 50px;     background-color: brown; } 

http://jsfiddle.net/zwpm9/

most of times, absolute positioning causes that. try not using absolute positioning


Comments

Popular posts from this blog

ios - iPhone/iPad different view orientations in different views , and apple approval process -

java Extracting Zip file -

C# WinForm - loading screen -