On Fri, Mar 2, 2012 at 3:36 AM, Erica Cavin <ecav...@verizon.net> wrote: > On this page: http://www.risingstarquilters.org/join_update.html > > the small arrow that should appear next to "Back to questions" displays > far to the left in Chrome and Safari. It displays properly in Firefox > and IE. Any thoughts as to why?
It looks like IE9 displays the same as Chrome and Safari, but IE8 displays the same as Firefox For starters, it's not a background-image. It's a list-style-image, so the background-position property doesn't have any affect. The list-item is as wide as the block and the text is aligned to the right. It looks like Firefox puts the bullet to the left of the text and the others put it to the left of the block. I hate to say it, but I think Firefox's presentation is wrong in this case. The spec says "The marker box is outside the principal block box.". Since the left of the list item's principal block box is all the way over on the left, that's where the bullet should be. For the desired effect, you should set list-style-position:inside. This will have no effect in Firefox, but the others will render the bullet "as the first inline box in the principal block box" as defined in the spec. Ref: http://www.w3.org/TR/CSS21/generate.html#propdef-list-style-position -- Vince Aggrippino Ghodmode Development http://www.ghodmode.com > CSS here: http://www.risingstarquilters.org/styles2.css > > Thanks! > > Erica > -- > Attic Windows Web Design > http://atticwindowswebdesign.com/ ______________________________________________________________________ css-discuss [css-d@lists.css-discuss.org] 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/
