43
votes
11answers
73k views

Emulating CSS3 border-radius and box-shadow in IE7/8

I'm working on HTML for a small web application; the design calls for a content area with rounded corners and a drop shadow. I've been able to produce this with CSS3, and it works flawlessly on ...
53
votes
4answers
58k views

drop shadow only bottom css3

Is there a way to drop the shadow only on the bottom?. I have a menu with 2 images next to eachother. I don't want a right shadow because it overlaps the right image. I don't like to use images for ...
134
votes
6answers
80k views

Box-shadow only on one side

Many times i need to create a shadow of some block element but only (for example) on its right side. The way I do it is to wrap the inner element with box-shadow into an outer one with padding-right ...
48
votes
10answers
24k views

box-shadow on IE9 doesn't render using correct CSS, works on Firefox, Chrome

I'm trying to simulate a floating modal box type thing but having an issue with IE9 and its box shadow implementation. Here's a summary of the code I'm using which can duplicate the issue: ...
23
votes
4answers
20k views

SVG drop shadow using css3

Is it possible to set drop shadow for an svg element using css3 , something like box-shadow: -5px -5px 5px #888;-webkit-box-shadow: -5px -5px 5px #888; I saw some remarks on creating shadow using ...
26
votes
9answers
25k views

Box-shadow and border-radius bug in Chrome

I've been experimenting with CSS3 and found something strange. Heres's the part of DIV style: border:#446429 solid 1px; border-radius:15px; -moz-border-radius:15px; -webkit-border-radius:15px; ...
11
votes
4answers
6k views

CSS3 box shadow on top of children

How do I get an inset CSS3 box shadow to render on top of its children elements? Problem: HTML: <div id="chatroom"> <div class="chatmessage"><b>User ...
11
votes
4answers
12k views

CSS3 box-shadow blur in IE9

Has anyone else noticed that IE9's "standard" implementation of CSS box-shadow differs from other browsers? Whenever I use box-shadow and set a blur value, IE9 seems to render the blur at about half ...
5
votes
2answers
5k views

CSS3 box-shadow causes scroll-lag (slow performance) on Safari 5.0.2?

Hey there, this time I have a quite rare issue that's occurring only in Safari 5.0.2. When using CSS3's box-shadow parameter, Safari's performance is that bad, you can't even scroll down properly or ...
4
votes
2answers
481 views

Is css box-shadow part of element's box model?

Is box-shadow part of box? width of shadow will be included in total width of Block element?
3
votes
3answers
2k views

CSS3 box-shadow property doesn't validate?

When I run my CSS through the W3C's validator, any time I use the box-shadow property, I get an error like this: 0 is not a box-shadow value : 0 0 10px #000 It appears to stop at whatever the ...
5
votes
1answer
3k views

Taper/fade CSS box shadow?

I've got a CSS drop down menu that I'm trying to build, and the background of the drop down has a faded/tapered box shadow: I'm having trouble pulling off how to get the box shadow to actually ...
10
votes
6answers
5k views

Why does a background break a box-shadow inset effect?

Im trying to achieve an inner-shadow effect on a simple box, something like: where the green box is the content inside another box. My problem is that if i give the content box any kind of ...
10
votes
7answers
8k views

Firefox & CSS3: using overflow: hidden and box-shadow

I'm not sure whether this bug applies to Firefox only or also to WebKit-based browsers, but it's really, really annoying. I've got a template/framework for my CMS interface, using box-shadow on a ...
5
votes
2answers
3k views

Do I still have to use all five vendor prefixes for the CSS box-shadow property?

When declaring say box-shadow or text-shadow or gradients for that matter, do you still need all the prefixes? -webkit-box-shadow: inset 0 0 1px 1px #e3e3e3; -moz-box-shadow: inset 0 0 1px 1px ...

1 2
15 30 50 per page