css - Creating a three row layout -


I'm currently in the process of creating a three line layout, so far is not very difficult. The problem arises because I need a width of 100% to fill each row with any color, and I need to have 1024 / 960px of the device within each line and is centered.

Something along these lines:

  & lt; Div class = "top" & gt; & Lt ;! - It should be 100% - & gt; & Lt; Div class = "logo-holder" & gt; & Lt; / Div & gt; & Lt ;! - It should be 1024px centered - & gt; & Lt; Div class = "menu-holder" & gt; & Lt; / Div & gt; & Lt ;! - It should be 1024px centered - & gt; & Lt; / Div & gt; & Lt; Div class = "main" & gt; & Lt ;! - It should be 100% - & gt; & Lt; Div class = "rotation-banner" & gt; & Lt; / Div & gt; & Lt ;! - It should be 1024px centered - & gt; & Lt; Div class = "promo-holder" & gt; & Lt ;! - It should be 1024px centered - & gt; & Lt; Div class = "promo-banner" & gt; & Lt; / Div & gt; & Lt; Div class = "games-list" & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; / Div & gt; & Lt; Div class = "footer" & gt; & Lt ;! - It should be 100% - & gt; & Lt; Div square = "footholder" & gt; & Lt; / Div & gt; & Lt ;! - It should be 1024px centered - & gt; & Lt; / Div & gt;  

Tnks in advance, Tonio

  .top ,. Main,. Piler {width: 100%; Text align: center; } .logo-holder ,. Menuu-holder, .rotating-banner, .promo-holder, .footer-holder {width: 1024px; Margin: 0 auto; Align text: left; }  

Should do this.


Comments