View Full Version : overflow: auto causing vertical scrollbar despite no explicit height

07-06-2010, 12:29 AM
Hey all,

When you specify a rule of overflow: auto to an element, I was told that a scrollbar will only appear if you set an explicit width or height to the same element. Well, in the below case, I was getting a vertical scrollbar despite the fact that I specified no height rule on the div. The scrollbar only went away when I reluctantly added padding:

.layout {
width: 900px;
overflow: auto;
margin: auto auto;
padding: 3em;
background: url('/images/fieldsettran.png') repeat-y;

.layout div:first-child {
width: 300px;
float: left;

.layout div:last-child {
width: 550px;
float: left;

Does anyone know the logic as to why the scrollbar appeared in the first place (despite no explicit height set to the div container) and why it was only when I specified padding did it go away?

Thanks for any response.

I don't know if it matters, but one of the divs contained form elements.

07-06-2010, 04:41 AM
Because a padding of 3em on each side will cause the overall width to be 850px + 6em which is likely greater than 900px therefore a scrollbar will appear. I'm betting its just the horizontal scrollbar that is actually active.