CSS box shadow on container div causes scrollbars

Question

I have a website with the following setup:

Answer 1

Imho, and according to my tests seems that css shadow on an element is increasing both total width and height of the page ( if the surrounding element has width or height set to 100%) as you said and I haven't found a css workaround for this problem yet.

So I've a question for you, how are you keeping your footer at the bottom of the page? and what's the width the footer has?

I've tried with absolute positioning ( as I'm used to do when I want a footer at the bottom of the page) but the problem It's the same with the width, of course you can set the width to a percentage like 90% but the problem remains... here's a snippet that illustrate this simple concept So this isn't a real answer, I've not found a solution for this yet

pastebin

Hope this's useful