John, I had the same problem with Opera 7.0 but fixed it with “br clear=all” and “clear:both” properties for several HTML elements. In fact I don’t have the Netscape 6 on my machine but my photo site should work on it. You might check it and then have a look at the source.
I can’t get this to work under xhtml strict or 1.1 – I get an ugly lower padding for the inner div… if I do padding: 0px 5px 5px 0px; the Safari and Firefox don’t display properly… if I do padding: 0px 5px 0px 0px; then IE doesn’t display properly… any ideas?
OK, I wrote too soon: the shadows work fine in strict xhtml if you add the following to the img css: vertical-align:bottom; (leaving padding: 0px 5px 5px 0px; for the div). I actually discovered the answer on http://phoenity.com/tests/fuzzy_shadows_anchor.html – thanks to Lim Chee Aun who was the only person I found to implement a version of Sergio’s method in STRICT rather than transitional…!!!
Copy & paste the code below to embed this comment.
Les
Great article.
It seems that I’m suffering the same as Mr Schrab (http://www.alistapart.com/discuss/cssdrop2/#c7860) – I’ve got a css defined nav bar from an unordered list, but as soon as I pop in the DX code the links stop working in IE!
80 Reader Comments
Back to the Articlejot.be/Jan
John, I had the same problem with Opera 7.0 but fixed it with “br clear=all” and “clear:both” properties for several HTML elements. In fact I don’t have the Netscape 6 on my machine but my photo site should work on it. You might check it and then have a look at the source.
CloD
Does this technic or a similar one work for tables ?
Thanks.
TerryG
It’s definitely a cool technique, but I really think it’s a lot of effort (and discussion) over a teeny, tiny bit of return.
A poster early on said that the hard-edged drop shadows were too ugly to use, but now that they are nicely fuzzy they like them.
That’s just TOO much attention to detail for me. I think my attention is more productively used elsewhere on site design & maintenance.
But the article WAS well written, and I appreciate the effort that went into it.
T.
Thalwil
I can’t get this to work under xhtml strict or 1.1 – I get an ugly lower padding for the inner div… if I do padding: 0px 5px 5px 0px; the Safari and Firefox don’t display properly… if I do padding: 0px 5px 0px 0px; then IE doesn’t display properly… any ideas?
Thalwil
OK, I wrote too soon: the shadows work fine in strict xhtml if you add the following to the img css: vertical-align:bottom; (leaving padding: 0px 5px 5px 0px; for the div). I actually discovered the answer on http://phoenity.com/tests/fuzzy_shadows_anchor.html – thanks to Lim Chee Aun who was the only person I found to implement a version of Sergio’s method in STRICT rather than transitional…!!!
radon
this thing isn’t working for me…
can you check it at http://radon.ytra.net/css/ ?
thanks
M
Try removing the » character from your CSS code. That one got me too.
But I’m having a problem, I’m not getting the rounded corners when I do this through an external CSS file. Works fine when done from the head though…
Bizarre????
iG.STUDiO
http://homepage.mac.com/igstudio/design/css-js-dropshadow/shadow-gif.html
Les
Great article.
It seems that I’m suffering the same as Mr Schrab (http://www.alistapart.com/discuss/cssdrop2/#c7860) – I’ve got a css defined nav bar from an unordered list, but as soon as I pop in the DX code the links stop working in IE!
Could someone please help?
Chazz
Hi,
ALA rulez!!
Question: I float an image and making a border is no prob. The drop shadow won’t float because I already used a float
Should I use two div’s to overcome this problem?
t
Thx for any help.
CU
Chazz