Search code examples
csswidthscreen

CSS width x less than width?

I'd like to have a navigation bar that's centered on the top of the page, and I'd like the width to be 80px less than the screen width. Is there a way to do this with pure CSS, no javascript? I've seen this done before, but I didn't bother to check the source at the time.

Solution

  • Just use margin-left: 40px and margin-right: 40px on the navbar div.

    Sample:

    <html>
  <head></head>
  <body style='padding: 0; margin: 0;'>
    <div style='margin: 0 40px 0 40px; background-color:red;'>CONTENT YAY.</div>
  </body>
</html>