John Huetz wrote:
We're developing a site content management process which separates the
content from the presentation, what a novel idea. The designers want to
be able to indicate within a list of links which link may be "new" by
displaying a "NEW" graphic after the link text. What I'm trying figure
out is how to make that happen within the style sheet only, such that
the programmers only have to add a "class='new'" to the a tag inside
the list item.
John, I've just had a play with this, and unfortunately, due
circumstances beyond our control (ie IE!), the best that I could come up
with was to add an empty <span class="new"> element:
HTML:
<ul>
<li><a href="#">Class definition on a span<span
class="new"></span></a></li>
<li><a href="#">Class definition on a span that wraps inside the ul
block<span class="new"></span></a></li>
</ul>
CSS:
span.new {
background: url(http://www.johnhuetz.com/images/new.gif) no-repeat
100% 0.3em;
padding-right: 28px;
_display: inline-block; /* for IE6 */
}
I've tested in Firefox (1.0.6), Opera (8.02) and IE6 - haven't tested in
Mac browsers.
I agree with you - if someone knows of a better technique that removes
the need for unneccessary elements, I, too, am all ears!
cheers,
Stuart
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/