mvc css border layout

fbartic

New Member
I am trying to set up a border layout with top, left, center, right, bottom. I have seen a few examples and tried them, but none of them seem to work. The main problem is with the left, center, and right columns. I can only get two divs aligned horizontally, the third always falls below the footer. I need this to be resizable. Preferably the center pane will fill the full until the borders.I have tried float left and float right but it didn't make a difference.This is what I have tried so far. http://jsfiddle.net/xQVWs/2/\[code\]<body><div class="top-wrapper"> <div class="content-wrapper"> <header> header </header> </div></div><div class="mid-section"> <div class="left-wrapper"> Left Pane </div> <div class="main-content"> Main pane </div> <div class="right-wrapper"> right pane </div></div><div class="bottom-wrapper"> <div class="content-wrapper"> footer </div></div></body>\[/code\]
 
Top