css wide line
container is limited, but header and footer are wide:
<!doctype html> <html> <head> <meta charset="utf-8"> <title>page title</title> </head> <body> <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> </body> </html> |
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; } |