HTML padding

Hello on I have some padding on all sides of the HTML element to add a textured background all around the sites

html {
background: #CCC url(;
padding: 20px 20px 20px 20px;

For some reason I am not getting the padding on the bottom and the texture does not show.

Anyone know the issue?

Thank you for the help.

You set the html to height:100% but your layout is much taller than 100% so the background gets cut off. You also added padding to the 100% so you have 100% + 40px padding which will give you a vertical scroll on pages that don’t need it.

Use min-height:instead and box-sizing to make sure the padding is contained within the 100%.



Height:auto is the default but you seem to have defined 100% in a couple of places.

The above code will produce this:

1 Like

Thanks Paul.

That did the trick. I thought it was something like that.

1 Like

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.