HTML and CSS Reference
In-Depth Information
<div class="two">
Box with a inset shadow with a large blur
</div>
Figure 14.2
Example of an
inset box shadow
without and with
a blur radius.
The
box-shadow
property is supported now in Firefox 3.5+, Safari 3.0+,
Chrome 1+, Opera 10.5+, and Internet Explorer 9+. Safari 5+ and Chrome
4+ offer full support of the
box-shadow
definitions, but older versions
here.com/article/384/
for more information on creating a cross-browser
drop shadow using both the
box-shadow
property and the proprietary IE
filter extension to apply a similar shadow in IE6 through IE8.
Through CSS 2.1, background images were displayed at their default/
inherent size. If you wanted to have an image behind an element be
the fill size of the element, you would either have to make sure the size
of the image and the element matched or have to use some trickery to
place the image in a
<div>
positioned and sized to the content element
but with a lower
z-index
value.
But now images can be scaled or resized using the
background-size
property that accepts two values: the first for the horizontal sizing and
the second for the vertical sizing (if one value is given, the second is
assumed to be
auto
).