It seems like this Jukka's solution actually puts the underline across 100% of the display area which can carry it past the end of the longest line. I would love to see a solution that stops at the end of the longest line and increases all of the other <li> underlines as well, regardless of screen or div size. Anyone have that solution using CSS?
Rod Castello On Fri, Jan 31, 2014 at 12:53 PM, Tom Livingston <[email protected]> wrote: > On Fri, Jan 31, 2014 at 3:29 PM, Jukka K. Korpela <[email protected]> > wrote: > > 2014-01-31 20:07, Tom Livingston wrote: > > > > [...] > > > >>>> ul a{ > >>>> display: block; /* <- Add this */ > >>>> > > [...] > > > >> Ha ha. As always, I can't see the forest for the trees. Such a simple > >> solution David... :-/ > > > > > > But to a problem different from the one asked, which was about setting > the > > width of underlines to the width of the widest link text. The code above > > sets it to the available width, since block elements have width: auto > > (effectively, width: 100%) as the default. > > > > Yucca > > > > > > Understood, but won't the longest link push out the width of the > <li>s? In which case setting display: block; on the <a>s will cause > them to always be as wise as the widest one? And this will result in > what the OP wanted, no? > > > -- > > Tom Livingston | Senior Front-End Developer | Media Logic | > ph: 518.456.3015x231 | fx: 518.456.4279 | mlinc.com > ______________________________________________________________________ > css-discuss [[email protected]] > http://www.css-discuss.org/mailman/listinfo/css-d > List wiki/FAQ -- http://css-discuss.incutio.com/ > List policies -- http://css-discuss.org/policies.html > Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ > ______________________________________________________________________ css-discuss [[email protected]] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
