John Huetz wrote:
>... 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.
> I'm trying to adapt a technique put forth by "Arleen" on this page:
> The CCS3 techniques won't work for us, since the audience for the site
> all use MS IE 6 (this is an intranet site accessed by engineered
> desktops). While we always strive for highly compliant markup, we must
> always remain cognizant of our IE-centric environment.
> I'm running into the problem that the last poster wrote about, "If the
> link wraps two lines or more, the image is not positioned correctly."
> As I worked on this more, it's apparent that this technique fails in
> IE, not in the Mozilla variants.
> I put together a test page:
> The first unordered list is the Arleen technique, which if you view
> this page in MS IE 6, you can see the failure on the second link.
> The second unordered list moves the "new" class to the <li>, which
> poses a vertical positioning problem on the wrapped link.
> The last unordered list is my last-ditch attempt, which has the site
> programmers insert an empty <img> tag with a class definition if the
> link is decalred "new". This doesn't work at all in Firefox, but is
> close enough in IE.
> I'd greatly appreciate comments or similar experiences ... is there a
> better way to do this?
You might use a technique discussed here
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/