http – Side fill when width is higher then 1280px – Education Career Blog

I want to make a website that fills the pagewidth to 100% for all widths (available space) lower or equal to 1280px and for all widths greater than 1280 two filling side bars should appear (like this: |fill|website|fill|).

(How) can i do this without scripts? (by using css settings?)


You could use something like this:

#content {
  max-width: 1280px;
  width: 100%;
  margin: 0 auto;

That refers to the style applied to a div that has all the page’s contents.

Your “sidebars” would be whatever the background body is.


Do you want content in the “fill” bits, or just a border type thing? If just a border, you can use a background image/colour to make the fill effect, and use max-width on the main content bit. Be aware that it won’t work in IE6, if that’s important to you.

<div style="max-width: (bar width * 2) + 1280">

    <div style="max-width: 1280px">

        <!-- content -->



Leave a Comment