Barney Carroll wrote:
> Hello folks.
>
> I have created a system whereby I introduce little symbols inside
> paragraphs at key points. Because I'm insane, I thought the best way to
> do this was to create empty spans with background-images rather than images.
>
> This system works absolutely beautifully in Firefox:
>
> span.public,
> span.members
> {
> display: inline;
> position: static;
> padding: 1em 0 1em 1em;
> margin: 0;
> background-image: url(images/bullet4patients.gif);
> background-repeat: no-repeat;
> background-position: 0.25em;
> }
>
> For reasons I'm not entirely clear on, IE6 gives this the same space in
> the paragraph but doesn't render the background image (or more likely
> renders it somewhere out of sight). It occurred to me that IE6's
> improvisation of padding etc might be the problem, so I gave the span
> some body space for IE6:
>
> * html span.public,
> * html span.members
> {
> width: 4px;
> }
>
> Now it doesn't increase the horizontal space taken up at all, but does
> display the image at the correct point on the horizontal axis. The only
> problem is that, no matter what I specify for height, line-height,
> font-size, negative paddings etc. the span insists on taking up a huge
> amount of horizontal space, about two line-height's worth.
>
> Any idea why this is and what I can do to avert it?
The width in the star html hack does apply to inline level elements in
quirks rendering mode only. Once it has a width in IE, it behaves more
like inline-block. I assume the problems you reported are assigned to
the different rendering modes. An URL to a reduced testcase, as always,
would be helpful.
Ingo
--
Please do not reply offlist, hit reply-all instead.
http://www.satzansatz.de/css.html
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
IE7 information -- http://css-discuss.incutio.com/?page=IE7
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
