CODEWITHSUNDEEP
stylescss
Stasonix Niculin
Stasonix Niculin

Reputation: 557

How to set a box-shadow to the div element to all sides, left-shadow, right-shadow, top-shadow, bottom-shadow?

I can't create another parent div-container, is it possibly using only css tricks? box-shadow: 7px 7px 7px black; will create shadows only from right and bottom borders, but I need left and top too.

Upvotes: 3

Views: 11278

Answers (2)

Casey Robinson
Casey Robinson

Reputation: 1019

With box shadow there are 4 parameters; offset, blur-radius, spread, and color.

This is the code I use on my website. It produces a shadow with 0 offset and blur-radius, 8px spread, and a shade of gray.

 box-shadow: 0 0 8px #888888;
-moz-box-shadow: 0 0 8px #888888;
-webkit-box-shadow: 0 0 8px #888888;

Here is a quick example of the effect on an image.

Quick example of the effect on an image

http://www.css3.info/preview/box-shadow/

Upvotes: 14

Rohan Patil
Rohan Patil

Reputation: 2348

Try this

box-shadow:2px 2px 10px 10px #C9C9C9;
-webkit-box-shadow:2px 2px 10px 10x #C9C9C9;
-moz-box-shadow:2px 2px 10px 10px #C9C9C9;

or

you can use shadowOn. It's a great jquery plugin and very easy in use.

Upvotes: 1

Related Questions