3 div rækker

HTML kode 

 <?php
     if(!defined("FB_SECURE"))
         exit();
 ?>
 <div id="normalcontent">
             <h3>Welcome to Frozen Illusions!</h3>
             <div class="contentarea">
                 <img src="images/pic1.jpg" class="left" alt="A chinese lion statue" />
                 <p>Welcome to my personal playground! My name is Jakob, and I'm a web designer and developer. 
                 This site is not a real portfolio for my works, but more a playground (and <a class="internal" href="#blog">blog</a>) where I will post some of my latest ideas and thoughts.
                 <br />You can find more about me <a class="internal" href="#about">here!</a></p>
             </div>
         </div>
 
     
         <div class="divider1"></div>
 
         <div id="primarycontainer">
             <div id="primarycontent">
                 <h3></h3>
                 <!--<div class="post">
                     <h4>Consequat Odio Vestibulum</h4>
                     <div class="contentarea">
                         <div class="details">Posted by <a href="#">Jane Doe</a> on September 25, 2006</div>    
                         <img src="images/pic3.jpg" class="left" alt="A chinese dragon" />
                         <p>Aenean felis quisque eros. Cras lobortis commodo lorem ipsum dolor. Vestibulum vel purus. In eget odio in sapien adipiscing blandit. Lorem ipsum dolor sit amet consequat etiam sed dolore.</p>
                         <ul class="controls">
                             <li><a href="#" class="printerfriendly">Printer Friendly</a></li>
                             <li><a href="#" class="comments">Comments (18)</a></li>
                             <li><a href="#" class="more">Read More</a></li>                
                         </ul>
                     </div>
                 </div>-->
 
             </div>
             <div class="box">
                 <h4>Latest Work:</h4>
                 <div class="contentarea">
                     <img src="images/pic2.jpg" class="left" alt="Random foliage" />
                     <p>Sed etiam et lorem ipsum nulla vero et lobortis felis sed etiam. Lorem ipsum sit amet dolore. Nulla facilisi. Sed tortor. Aenean felis. Quisque eros etiam <a href="#">sed commodo</a>.</p>
                 </div>
             </div>
             <div class="box">
                 <h4>Latest Blogs:</h4>
                 <div class="contentarea">
                     <div style="background-color: #434343; padding: 3px;"><span style="color: #FFFFFF;">Project 1</span></div>
                 </div>
             </div>
             <div class="box">
                 <h4>Latest Experiments:</h4>
                 <div class="contentarea">
                     <img src="images/pic2.jpg" class="left" alt="Random foliage" />
                     <p>Sed etiam et lorem ipsum nulla vero et lobortis felis sed etiam. Lorem ipsum sit amet dolore. Nulla facilisi. Sed tortor. Aenean felis. Quisque eros etiam <a href="#">sed commodo</a>.</p>
             </div>
     </div>
             
 </div>

CSS kode 

 *
 {
     padding: 0em;
     margin: 0em;
 }
 
 body
 {
     background: #000000 url('images/bg1.jpg');
     padding: 35px 0px 35px 0px;
 }
 
 body,input
 {
     font-size: 10pt;
     font-family: "georgia", "times new roman", serif;
     color: #333333;
 }
 /* Normal text */
 p
 {
     line-height: 1.5em;
     margin-bottom: 1.0em;
     text-align: justify;
 }
 
 a
 {
     color: #B96D00;
     text-decoration: underline;
 }
 
 a:hover
 {
     text-decoration: none;
 }
 
 
 h3 span
 {
     font-weight: normal;
 }
 
 h3,h4
 {
     display: inline;
     font-weight: bold;
     background-repeat: no-repeat;
     background-position: right;
 }
 
 h3
 {
     font-size: 1.7em;
     padding-right: 34px;
 }
 
 h4
 {
     font-size: 1.2em;
     padding-right: 28px;
 }
 
 .contentarea
 {
     padding-top: 1.3em;
 }
 
 img
 {
     border: solid 1px #6F5230;
 }
 
 img.left
 {
     position: relative;
     float: left;
     margin: 0em 1.8em 1.4em 0em;
 }
 
 img.right
 {
     position: relative;
     float: right;
     margin: 0em 0em 1.8em 1.8em;
 }
 
 .divider1
 {
     position: relative;
     background: #fff url('images/border2.gif') repeat-x;
     height: 14px;
     margin: 2.0em 0em 1.5em 0em;
     clear: both;
 }
 
 .divider2
 {
     position: relative;
     height: 1px;
     border-bottom: solid 1px #eaeaea;
     margin: 2.0em 0em 2.0em 0em;
 }
 
 .post .details
 {
     position: relative;
     top: -1.5em;
     font-size: 0.8em;
     color: #787878;
 }
 
 .post ul.controls
 {
     clear: both;
 }
 
 .post ul.controls li
 {
     display: inline;
     font-size: 0.8em;
 }
 
 .post ul.controls li a
 {
     background-repeat: no-repeat;
     background-position: left;
     padding: 0em 1.0em 0em 20px;
 }
 
 .post ul.controls li a.printerfriendly
 {
     background-image: url('images/icon-printerfriendly.gif');
 }
 
 .post ul.controls li a.comments
 {
     background-image: url('images/icon-comments.gif');
 
 }
 
 .post ul.controls li a.more
 {
     background-image: url('images/icon-more.gif');
 }
 
 .boxWrapper
 {
     width: 100%;
     text-align: center;
     margin: 0 auto;
 }
 
 .box
 {
     padding: 1.5em;
     border-bottom: solid 1px #E1D2BD;
     float: left;
     background-color: #009AED;
     -moz-border-radius: 5px;
     width: 20%;
 }
 
 .box img
 {
     margin 0.5em;
     border: 2px solid #009AED;
 }
 
 .box img:hover
 {
     border: 2px solid #FFFFFF;
     cursor: pointer;
 }
 
 .box a
 {
     color: #FFFFFF;
 }
 
 ul.linklist
 {
     list-style: none;
 }
 
 ul.linklist li
 {
     line-height: 2.0em;
 }
 
 #upbg
 {
     position: absolute;
     top: 0px;
     left: 0px;
     width: 100%;
     height: 275px;
     background: #fff url('images/bg2.jpg') repeat-x;
     z-index: 1;
 }
 
 #outer
 {
     z-index: 2;
     position: relative;
     width: 60%;
     border: solid 7px #fff;
     background-color: #fff;
     margin: 0 auto;
 }
 
 #header
 {
     position: relative;
     width: 100%;
     height: 9.0em;
     background: #2B2B2B url('images/topbg.gif') repeat-x;
     margin-bottom: 2px;
 }
 
 #headercontent
 {
     position: absolute;
     bottom: 0em;
     padding: 0em 2.0em 1.3em 2.0em;
 }
 
 #headercontent h1
 {
     font-weight: normal;
     color: #fff;
     font-size: 2.5em;
 }
 
 #headercontent h1 sup
 {
     color: #777;
 }
 
 #headercontent h2
 {
     font-size: 1.0em;
     font-weight: normal;
     color: #aaa;
 }
 
 #search
 {
     position: absolute;
     top: 5.5em;
     right: 2.0em;
     padding-right: 0.0em;
 }
 
 #search input.text
 {
     margin-right: 0.5em;
     vertical-align: middle;
     border-top: solid 1px #000000;
     border-right: 0px;
     border-bottom: solid 1px #777777;
     border-left: 0px;
     padding: 0.15em;
     width: 10.0em;
 }
 
 #search input.submit
 {
     background: #009AED url('images/buttonbg.png') repeat-x;
     border: solid 1px #5F6800;
     font-weight: bold;
     padding: 0.25em;
     font-size: 0.8em;
     color: #F2F3DE;
     vertical-align: middle;
 }
 
 #search input.submit:hover
 {
     cursor: pointer;
 }
 
 #headerpic
 {
     position: relative;
     height: 109px;
     background: #fff url('images/hdrpic.jpg') no-repeat top left;
     margin-bottom: 2px;
 }
 
 #menu
 {
     position: relative;
     background-color: #009AED;
     height: 3.5em;
     padding: 0em 1.0em 0em 1.0em;
     margin-bottom: 2px;
 }
 
 #menu ul
 {
     position: absolute;
     top: 1.1em;
 }
 
 #menu ul li
 {
     position: relative;
     display: inline;
 }
 
 #menu ul li a
 {
     padding: 0.5em 1.0em 0.9em 1.0em;
     color: #fff;
     text-decoration: none;
 }
 
 #menu ul li a:hover
 {
     text-decoration: underline;
 }
 
 #menu ul li a.active
 {
     background: #009AED url('images/menuactive.png') repeat-x top left;
 }
 
 #menubottom
 {
     background: #fff url('images/border1.gif') repeat-x;
     height: 14px;
     margin-bottom: 1.5em;
 }
 
 #content
 {
     padding: 0em 2.0em 0em 2.0em;
 }
 
 #primarycontainer
 {
     float: left;
     margin-right: -18.0em;
     width: 100%;
 }
 
 #primarycontent
 {
     margin: 1.5em 22.0em 0em 0em;
 }
 
 #secondarycontent
 {
     margin-top: 1.5em;
     float: right;
     width: 18.0em;
 }
 
 #footer
 {
     position: relative;
     height: 2.0em;
     clear: both;
     padding-top: 5.0em;
     background: #fff url('images/border2.gif') repeat-x 0em 2.5em;
     font-size: 0.8em;
 }
 
 #footer .left
 {
     position: absolute;
     left: 2.0em;
     bottom: 1.2em;
 }
 
 #footer .right
 {
     position: absolute;
     right: 2.0em;
     bottom: 1.2em;
 }