100% width header doesn't fill browser

Question

When the browser window is small enough to force a horizontal scrollbar and you scroll right the background color of the header ends before the edge of the browser. I am using a css class. ``` .s_header { margin: 0; width: 100%; display: block; border-bottom: 1px solid #000; background-color:#b8dbec; height:133px; } ``` The contents of `

` are not as wide as the 4 column table below it where the content totals abot 840px with image widths+padding and a 140px fixed width column. So when the browser window is less than 840px there is a horizontal scrollbar which is ok except that the background of the header is cut off when you scroll. The parent elements of `

` are body and html for which 100% width means the window width. I've tried including overflow:visible in `.s_header` class without success. The body width is also set to 100% margin 0 Is there a simple way that I can get the background to extend on the right when a scrollbar appears? The…

Accepted Answer

set the margins of your body tag

The in-line way

```
<body style="margin: 0px 0px 0px 0px;">
```

In your style.css (or whatever)

```
body {
  margin: 0px 0px 0px 0px;
}
```

100% width header doesn't fill browser

Solution

Problem