On Apr 7, 2009, at 12:18 PM, Stephen Tang wrote:

> 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.

I see. Puzzling.

I put a border on that particular link, and that shows that the right  
part is actually clipped (the right-border didn't show up). Quizzing  
the page with the WebKit inspector didn't tell me anything as to why  
this clipping happens.

> 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.

Setting that <a> to display: inline-block is a cleaner way to solves  
this.
But that doesn't explain the 'why' of this.

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/

Reply via email to