The rounded corners in my SmugMug pages no longer display in Firefox or Opera. They still display in Chrome and Safari. (Never did display in IE8.) Since I've done some customization, I checked some other pages that weren't customized, which returned the same result. I have a website of my own, which uses css rounded corners, and they still display just fine in Firefox and Opera. What gives? Is this going to be fixed soon?

I notice drop-shadows are missing too.

Hi,

I am so sorry you are having such trouble. Can you do us a favor and send us a screen shot of what you are seeing when you view your SmugMug site so we can see what you are seeing?

Originally Posted by snoupi I notice drop-shadows are missing too.

I see no code defining either of these in your CSS.

Here is what my landing page looks like in Firefox:

I've already given you the web address, but here it is again:
http://snoupi.smugmug.com/

My theme is based on the SmugMug 'Turquoise' theme. I have not overwritten any of the SmugMug css regarding rounded corners or drop-shadow. I have checked other SmugMug sites that have no customized css, and the results are the same: no rounded corners; no drop-shadows in Firefox and Opera. While IE8 never did support your css, Firefox and Opera did, until recently. Both have updated in the past week, and this appears to be the result. Chrome and Safari appear to still support your css. I will try to post a screenshot of the display in Safari for comparison.

This is the display in Safari, and is what it looked like in Firefox and Opera, until recently. Notice rounded corners around boxes and button, and drop-shadow under button. (Chrome still displays rounded corners and drop-shadow; IE8 never did support these. Don't know about IE9. I have XP, so IE9 is not an option.)

As I said before, this problem appears even on SmugMug pages that are not customized, so it is not a problem or deficiency in my own css. In fact, the css round corners I created for my own website still display correctly in Firefox and Opera.

Originally Posted by snoupi This is the display in Safari, and is what it looked like in Firefox and Opera, until recently. Notice rounded corners around boxes and button, and drop-shadow under button. (Chrome still displays rounded corners and drop-shadow; IE8 never did support these. Don't know about IE9. I have XP, so IE9 is not an option.) As I said before, this problem appears even on SmugMug pages that are not customized, so it is not a problem or deficiency in my own css. In fact, the css round corners I created for my own website still display correctly in Firefox and Opera.

Go with something like this for now on:

.boxBottom
{border-radius:10px;box-shadow:5px 5px 5px #888888}

Originally Posted by J Allen Go with something like this for now on: .boxBottom {border-radius:10px;box-shadow:5px 5px 5px #888888}

Thank you for your effort, Joe. I was hoping that SmugMug would fix the css in their themes for EVERYONE, not require us to do it ourselves. Not only that, but the drop-shadows are missing ACROSS THE BOARD, in galleries, photos, thumbnails, etc. Some members don't even have the option of rewriting their css to regain the look and feel they had before Firefox and Opera changed their css standard. I know it's hard to write so all browsers will display correctly, but Firefox is a pretty major browser for SmugMug to be incompatible with.

Snoupi,
Thanks for the report. This seems to be something that changed with FF13 as it still works fine on FF12. I've passed this on to our QA team for investigation.

Thank you! You ARE a HERO!!! :)

Originally Posted by snoupi Thank you for your effort, Joe. I was hoping that SmugMug would fix the css in their themes for EVERYONE, not require us to do it ourselves.

Mozilla changed something in FF13+, you can see here http://support.mozilla.org/en-US/questions/928818

We'll see what we can do, thanks.

Thank you Andy. I have followed your link, and added my request for a solution. I'm not savvy enough to understand if Firefox considers this a "bug", which they intend to fix, or if this is "policy" like their current non-support of named anchors in iframes, which they will not fix. I'm a Firefox user, but am not happy with their arrogant disregard for the efforts of website designers. I would dump them, but that won't solve the problem that 20% of my viewers still use Firefox. Anyway, for some reason, the css I used for rounded corners on my own sites still works, but SmugMug's css does not work. I know that if I had to rewrite my css to meet Firefox's arbitrary changes, I would grudgingly do so, cursing Firefox all the way. I expect that I can trust SmugMug to do the same.

So... to correct the display of the buttons and drop-shadows, I have added some css to my stylesheet:

.imgBorder {
box-shadow: 2px 2px 5px -3px black;
}

.sm-button {
border-radius: 5px;
box-shadow: 2px 2px 5px -3px black;
}

I used a black shadow, gave it a generous blur, and downsized the shadow, so only the semi-transparent parts show. This way the shadow will work with any color background.

This works for Firefox (and Opera) which were the problem browsers. No detrimental effect to Chrome or Safari. I have XP, and can't use IE 9, so I can't check it in IE 9, but I expect it won't break anything. If anyone sees otherwise, please advise.

http://snoupi.smugmug.com/

I remain disappointed that this has been left up to the individual, rather than being corrected in SmugMug's own stylesheets.