html - The three-column layout conundrum, this time sans header and footer -


i know 1 of web 1.0 newbie questions, alas, in position asking myself. sites not necessitate sort of layout , looking @ doing 1 friend three-column layout, fixed-width center column...with twist of no header or footer box elements , stip 3 columns stretch height-wise fit size of screen on viewed.

further exacerbating issue body have 1 color or background image , center column have own background color or image.

visually, page layout such:

+----------+---------------+----------+ |nothing   |only content   |nothing   | |here      |will here   |here      | |just  |w/a different  |just  | |body b/g  |background     |body b/g  | |color or  |color or       |color or  | |image     |image          |image     | |          |               |          | |          |all 3 columns  |          | |          |always fill    |          | |          |screen height  |          | +----------+---------------+----------+ 

i have read interesting arguments against absolute positioning (adobe forums) clash faux columns , other absolute/relative positioning. ideally i'd floats not sure efficient way accomplish this. date have not tried because fell lap. again, know basic, when come doing sites 1 b/g color , centered elements has me thinking, 'why hard?'

not sure if intend middle section wider side columns - if want wider 33.3%.

for height, want:

    html, body {       height: 100%;     } 

then ensure central div is

  position: relative;   height: 100%;   margin: 0 auto; 

see fiddle here http://jsfiddle.net/mwqwd/


Comments

Popular posts from this blog

get url and add instance to a model with prefilled foreign key :django admin -

css - Make div keyboard-scrollable in jQuery Mobile? -

ruby on rails - Seeing duplicate requests handled with Unicorn -