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.
Asked
Active
Viewed 1.1k times
3
-
Take a look at this: http://stackoverflow.com/questions/3467452/css-shadows-all-four-sides-of-div – Frederick Behrends Nov 16 '11 at 11:37
-
Shadow from all sides? Why can't you simply use border or an image to create this effect? I am not sure if it's possible to combine two shadows on one div. – OptimusCrime Nov 16 '11 at 11:34
-
'caz my backgrounds colors are changing dynamicly by animation, and it's not a good job. – Stasonix Niculin Nov 16 '11 at 11:36
-
Partially transparent background image as a shadow? – OptimusCrime Nov 16 '11 at 11:39
2 Answers
14
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.

Casey Robinson
- 1,021
- 9
- 17
1
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.

Rohan Patil
- 2,328
- 1
- 16
- 23