No matter how wide you make your browser, you'll never be able to get
rid of the horizontal scroll bar. That's because this div has a CSS
stylesheet that says that its width is 100%. That's 100% of the
containing block, which is the <body>, and the width
of that is determined by the <window>.
So far, so good. So, why the scroll bar? The used width of this div is 62px more than 100%, because of the left and right borders, margins, and padding that it has. So, if the window is 500px, this div is 562 pixels. If we make the window 1000px, this div is 1062px. If we make the window a million pixels wide, this div will be a million plus 62 pixels.
Because it's wider than the window, it gets a horizontal scroll bar.
So, the message here is that the width of an element for the purposes of layout (sometimes called the used width) is the content width plus the sum of the widths of the borders, margins and padding.