user6908406 user6908406 - 1 year ago 64
CSS Question

Unable to adjust the BODY width with CSS

I need body to have a silver background and fill only 75% of the page. That is, only 75% of the page is painted silver, while the remaining part is unused and painted according to broswer's defaults. The left part of the page is my BODY, the right part is unused. I tried

body {
background-color: silver;
width: 75%;

But still the whole page is painted silver. How can I accomplish my task?

Answer Source

You would need to set the background color for both html and body.

In addition you have set a height of 100% to the html element and a min-height of 100% or 100vh to the body so that it will alway fill the whole height of the screen.

The padding: 0 and margin: 0 are important so that you won't have a border between your body and the window.

But be award that this will work only for modern browsers. I can't test older browsers right now, but it would assume that this will have problems with in IE below the version 9 or 10.

So if you want to support older browsers too, then you would need to use the solutions provided by the other answer and use a div as container for your content.

html {
  background-color: white;
  height: 100%;
  padding: 0;

body {
  background-color: silver;
  width: 75%;
  min-height: 100%;
  margin: 0;

div {
  height: 500px;
  width: 50px;
  background-color: red;

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download