Css border-shadow add element size

Possible duplicate:
Is the css box-shadow part of the element's box model?

Is the css border-shadow property an addition to the element's size, or is it added after and does not affect other elements?

So my div width is 100px, margin 10px, border 1px, padding 5px, box-shadow 2px, this is the total element width of 136px (including everything above) or 132px (only the first four).


source to share

4 answers

no, the shadow does not affect the size of the elements (just like an outline; read more about it here ). To answer an example: your div is 132px wide.



No, the drop shadow is not part of the item, which means that the drop shadow is not considered in the item's final total measure.

Source: http://css.flepstudio.org/en/css3/box-shadow.html



According to the CSS3 box-shadow spec:

The outer shadow of the shadows casts a shadow as if the bounding box of the element were opaque. The drop shadow is only drawn outside the border: it is clipped inside the border element.

For more information see http://www.css3.info/preview/box-shadow/

The FireBug or Google Chrome inspectors are useful tools for this kind of thing.




I think the shadow is not computed.



All Articles