html { overflow-x:hidden; } .container { max-width:200px; margin:0 auto; background:#afa; } .header, .footer { background:#ffa; border-bottom:1px solid #777; position:relative; } .header:before, .footer:before { content:""; display:block; background:#ffa; border-bottom:1px solid #777; height:100%; width:6000px; position:absolute; left:-2000px; top:0; z-index:-1; }
<div class="container"> <header class="header"> header </header> <nav> navigation </nav> <article> <section> <p>content</p> </section> </article> <aside> sidebar </aside> <footer class="footer"> footer </footer> </div>