Menu
I need to apply the border shadow on border-bottom by CSS3. I just want to apply CSS3 shadow on bottom. Is this possible?
964
This can be overcome by eliminating padding on outer container (where the shadow applies) and using an inner container where you apply needed padding. If you want to change the depth of the shadow, simply increase the height style in the after pseudo element.
CSS Demo: box-shadowIf a border-radius is specified on the element with a box shadow, the box shadow takes on the same rounded corners. The z-ordering of multiple box shadows is the same as multiple text shadows (the first specified shadow is on top).
Note: By default, the shadow generates outside the box but by the use of inset we can create the shadow inside the box. Syntax: box-shadow: h-offset v-offset blur spread color | inset; Approach: To give the inset shadow to an element, we will use the box-shadow property.
box-shadow: h-shadow v-shadow blur spread color inset; In your example you're offsetting shadow by 10px vertically and horizontally. Like in other comments set first two values to 0px in order to have even shadow on all sides.
Try:
div{ -webkit-box-shadow:0px 1px 1px #de1dde; -moz-box-shadow:0px 1px 1px #de1dde; box-shadow:0px 1px 1px #de1dde; }<div>wefwefwef</div>It generally adds a 1px blurred shadow 1px from the bottom of the box
box-shadow: [horizontal offset] [vertical offset] [blur radius] [color]; If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
