You are here: Reference > CSS > properties > browser specific extensions > -moz-box-shadow

-moz-box-shadow property | -webkit-box-shadow property

Browser support:
-moz-box-shadow:
3.5
-webkit-box-shadow:
Specifies a comma-separated list of shadow effects to be applied to the box of the element.
Note: The -moz-box-shadow property is supported in Firefox from version 3.5.
JavaScript page for this property: MozBoxShadow | webkitBoxShadow. You can find other example(s) there.

Possible values:

 One of the following values: 
 Values in this order (use the space character to separate them): 
1. <horizontal offset in length>
2. <vertical offset in length>
3.
<blur radius in non-negative length> possible but not necessary; left to personal choice
4. <color>
none
inherit

Description of values:

blur radius in non-negative length
The blur radius of the shadow in length units, 0 means sharp, larger values mean the shadow is blurred. For the supported length units, see the length page.
color
Color of the shadow. For the supported color values, see the colors page.
horizontal offset in length
The horizontal offset of the shadow in length units. For the supported length units, see the length page.
inherit
Takes the value of this property from the computed style of the parent element.
none
Default. No shadow is drawn.
vertical offset in length
The vertical offset of the shadow in length units. For the supported length units, see the length page.
Default: none.

Example HTML code 1:

This example illustrates the use of the -moz-box-shadow and -webkit-box-shadow properties:
<head>
    <style>
        .example {
            width: 250px;
            height: 100px;
            background: #e4e4e4;
            border: 1px solid #acacac;
            -moz-box-align: center;
            -moz-box-shadow: 5px 5px 5px gray;
            -webkit-box-shadow: 5px 5px 5px gray;
        }
    </style>
</head>
<body>
    <div class="example">
        Some text content within a division element
    </div>
</body>
Did you find this example helpful? yes no

Supported by tags:

Related pages:

External links:

User Contributed Comments

Post Content

Post Content