Span background-image bug?

  • Thread starter Thread starter Walker
  • Start date Start date
W

Walker

I have a span containing two words. Eg.

<span>Avant Garde</span>

Using CSS, I insert a background image (a bullet) to the left of the
text. Eg.

span {
padding: 0 3px 0 11px;
background: url(images/tagbull.gif) no-repeat 0px 2px;
}

The tag renders as expected...unless the line wraps in the middle of the
two words. Then the background-image doesn't appear. This only happens
in IE. It renders fine (as expected) in Firefox 1.5 and Opera 8.51. Is
this a known IE bug?

To see an example, browse to the following URL with IE6 (obviously) and
expand the "10 Tags" link:
<http://arty.me.uk/2006/01/04/announcing-avantist/>

Look at the words "Avant Garde" at the end of the first line.
Now do the same with Opera or Firefox.
 
Walker said:
I have a span containing two words. Eg.

<span>Avant Garde</span>

Using CSS, I insert a background image (a bullet) to the left of the
text. Eg.

span {
padding: 0 3px 0 11px;
background: url(images/tagbull.gif) no-repeat 0px 2px;
}

The tag renders as expected...unless the line wraps in the middle of the
two words. Then the background-image doesn't appear. This only happens
in IE. It renders fine (as expected) in Firefox 1.5 and Opera 8.51. Is
this a known IE bug?

To see an example, browse to the following URL with IE6 (obviously) and
expand the "10 Tags" link:
<http://arty.me.uk/2006/01/04/announcing-avantist/>

Look at the words "Avant Garde" at the end of the first line.
Now do the same with Opera or Firefox.
Click to expand...

You need to be in news:comp.infosystems.www.authoring.stylesheets

As far as I know "span" is an inline element..

e.g.
..red { color: red; background-color: transparent; }
.....
<p>This is a <span class="red">red</span> letter day.</p>
 
Walker wrote:
//
To see an example, browse to the following URL with IE6 (obviously) and
expand the "10 Tags" link:
<http://arty.me.uk/2006/01/04/announcing-avantist/>
Click to expand...

In case anybody is clicking and getting confused, this page will no
longer exhibit the problem because I got a fix via somebody in
comp.infosystems.www.authoring.stylesheets.

Google Groups link: <http://makeashorterlink.com/?P2AD45B6C>

I still don't know whether the original problem was an IE6 bug...so
it'll be interesting to see how IE7 deals with Span background-images.
 
Back
Top