> Ryan Becker schrieb: > > <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" > > "http://www.w3.org/TR/html4/strict.dtd";> > > <html dir="rtl"> > > <head> > > <title>Underline Test</title> > > <style> > > .underlinedText { > > display: inline; > > position: relative; > > top: 20px; > > right: 20px; > > border-bottom: 1px solid #FF0000; > > } > > </style> > > </head> > > <body> > > <div class="underlinedText">This should have a red > > underline.</div> > > </body> > > </html>
> The Holly hack does not help, but one declaration out of this > subset _zoom:1; / float: right; / position: absolute fixes it > in your example page. Hmm... _zoom:1 is close - not at all pretty - but almost works in all situations. The others fail, depending on the context (as does the padding fix - only sometimes works). _zoom:1 works except for when the text wraps, in which case the underline shows up under the last line of text only, not on each line. In fact, I just realized this is what happens with float:right and position:absolute as well. The text needs to be able to wrap. I actually think I have a solution if the text didn't have to wrap (something like <div style="position:relative; top:20px; border-bottom:1px solid #FF0000; white-space:nowrap; _width:1px;">Test, test, test.</div>). > (Another "alternative" is to insert a nbsp (or a dot or other > delimiters) as the first letter: > <div class="underlinedText"> This should have a red > underline.</div>) > > mysterious are the ways of IE. It's incredible that a nbsp would fix that... Mysterious indeed. Wow. Thanks for your ideas! I might end up using the _zoom:1 hack. Though I'd like to think there's a better way, it comes the closest to a general solution. Ryan ______________________________________________________________________ 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/
