Get a free trial // Grow your CSS skills // Land your dream job

CSS list menus- Verical Align

  • # November 25, 2008 at 5:47 pm

    CSS menus.
    I have a website I am working on.
    The menu is a list. I need to vertically align the list elements or text to the parent div. Some of the links are 2 lines and some are 1line of text.


    Link 1 Link 2 Link 3
    3X Text

    Something like that.
    I want the text to v-align to the center of the parent div. I tried padding, that is not what I need. I need all text to align vertical. The single lines need to vertical align to the multiline links. I have had a ton of trouble trying to make this work. I got it to work in Firefox of course but completely broke in IE6 and 7 (of course). Example is here.

    Any help is much appreciated. Thanks

    # November 25, 2008 at 5:53 pm

    I use line height I find its the easiest.
    Lets say the div your list-item is in it 30px in height you put line height for the font within it at 30px this gives you the desired effect.

    # November 25, 2008 at 7:07 pm

    This might help.

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

You must be logged in to reply to this topic.

There's a whole bunch of content on CSS-Tricks.

Search for Stuff   •   Browse the Archives

Get the Newsletter ... or get the RSS feed