Grow your CSS skills. Land your dream job.

[Solved] Borders under text…

  • # November 19, 2009 at 2:48 am

    I am making a nav bar with an unordered list. I have added a 10 px red border under the entire list so it stretches across the entire page. But, I would like that border to touch the baseline of the text above it. Is this possible?

    I figure I could put make the border out of a separate div tag and give it a top negative margin; but, I also want the portion of the border just under the list item to darken when a cursor is placed over it, indicating a link.

    Is this possible using just CSS? I can only get the border to touch the descenders of the type, not the baseline.

    Thank you!

    # November 19, 2009 at 2:58 am

    You could try giving the text a line height smaller than the size of the text.

    # November 19, 2009 at 3:28 pm

    Yes! That’s great. Plus, changing the Display type from Inline to Block offers a whole new range of options.

    Thank you!

Viewing 3 posts - 1 through 3 (of 3 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".