Hi Phillipe, The actual bug appears here: http://www.realsimple.com/food-recipes/shopping-storing/beverages/best-coffee-00000000008163/index.html
In the right column, there is a link called "See All Galleries." There is a green arrow underneath this text, but the overlap only happens in Safari 3.x. When viewing in Firefox 3 or IE6/7/8, the green arrow is to the right of the text. I attempted to isolate the markup and CSS onto a test page, but I cannot reproduce the bug. The only way I could fix the problem was to attach the background image to the DIV, not the anchor. However, I am still at a loss why Safari behaves this way. It's as if the right-padding on the A is being ignored. --Stephen On Mon, Apr 6, 2009 at 8:08 PM, Philippe Wittenbergh <[email protected]> wrote: > > On Apr 7, 2009, at 1:48 AM, Stephen Tang wrote: > >> The CSS looks like this: >> .viewAllLink a {padding: 4px 20px 0 0; background: >> url(../i/green-arrows.gif) center right no-repeat; font:normal 13px >> "Tahoma", verdana;} >> >> This works in IE6, IE7, IE8, and FF3, but not Safari 3.x. In Safari, >> the link text overlaps the background image like this: >> http://stephentang.info/safari/test.jpg >> >> ... >> >> It seems that Safari's idea of how padding works on the anchor tag is >> different than the other browsers I tested. In all the other >> browsers, the padding applies inside the anchor tag, which pushes the >> link text away from the background image. In Safari, the padding >> applies outside of the anchor tag, so the background image is >> obfuscated by the text. The padding just pads the anchor tag relative >> to its parent element. > > Can you post a url of a test case that actually shows the issue ? A > screenshot and lose code snippets are hard to debug :-). > > Fwiw, I never experienced issues with similar markup and styling on Safari > 3.x. > > I do know that Safari sometimes had (has ?) problems with top-padding on > inline elements, but only when using a transitional doctype. > such as this bug report > https://bugs.webkit.org//show_bug.cgi?id=8544 > > Philippe > --- > Philippe Wittenbergh > http://l-c-n.com/ > > > > > > ______________________________________________________________________ css-discuss [[email protected]] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
