Style.css and Index.html are attatched. index.htmlstyle.css

 

 

 

 

 

The question: How would I move the "Body Content" between the left and right nav and have the left and right nav reach the top? This is just probably a learning curve that I need to get over. Please post here if you know the answer to this.

 

Thanks

Rearrange your divs to look like this:

<div id="uppernav">UpperNAV</div>
<div id="leftnav">LeftNAV</div>
<div id="body">Body Content</div>
<div id="rightnav">RightNAV</div>
<div id="lowernav">LowerNAV</div>

Change the following CSS attributes:

#leftnav{
    float:left;
    width: 240px;
    height: 1000px;
    background-color: lightblue;
}

#body{
    float: left; 
    height:800px;
}

Should be fine then. The key is to arrange the divs how you'd want them ordered on-screen (so left div, middle div, then right div) and then add appropriate floating to align them all up together. Then, to make the entire site reach the top of the window, add this to your CSS:

 

body{
    margin: auto;	
}

Unless you mean something else by "having the left and right navs reach the top". They touch the upper nav regardless.

Edited July 29, 201313 yr by throzen

Here you can check it...
http://jsfiddle.net/Rm4UM/