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?
Regards,
Barney
______________________________________________________________________
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/