Results 1 to 4 of 4

Thread: vertical align in list

  1. #1
    Join Date
    Jul 2008
    Posts
    81
    Thanks
    38
    Thanked 2 Times in 2 Posts

    Default vertical align in list

    Hi,

    I have a simple unordered list:
    PHP Code:
    <ul>
    <
    li style="height:25px; width:25px; text-align:center;"><a href="1.html">1</a></li>
    <
    li style="height:25px; width:25px; text-align:center;"><a href="2.html">2</a></li>
    <
    li style="height:25px; width:25px; text-align:center;"><a href="3.html">3</a></li>
    </
    ul
    How can I have the links vertically centered inside the li's?

    Thanks!

  2. #2
    Join Date
    Sep 2008
    Posts
    56
    Thanks
    0
    Thanked 6 Times in 6 Posts

    Default

    Hi,

    You can apply some padding to get it in the middle.

    <ul>
    <li style="height:25px; width:25px; padding-top:8px; text-align:center;"><a href="1.html">1</a></li>
    <li style="height:25px; width:25px; text-align:center; padding-top:8px"><a href="2.html">2</a></li>
    <li style="height:25px; width:25px; text-align:center; padding-top:8px"><a href="3.html">3</a></li>
    </ul>

    Hope This Helps,
    Cheers,

  3. The Following User Says Thank You to maneetpuri For This Useful Post:

    lord22 (11-07-2009)

  4. #3
    Join Date
    Nov 2007
    Location
    USA
    Posts
    170
    Thanks
    8
    Thanked 22 Times in 22 Posts

    Default

    You can also try applying a line-height:
    Code:
    <li style="height:25px; width:25px; line-height: 1.5em; text-align:center;"><a href="1.html">1</a></li>
    Last edited by Moshambi; 11-05-2009 at 08:12 AM. Reason: forgot end code tag
    What is obvious to you might not be to another.


    My Site

  5. The Following User Says Thank You to Moshambi For This Useful Post:

    lord22 (11-07-2009)

  6. #4
    Join Date
    Oct 2008
    Location
    kolkata, india
    Posts
    75
    Thanks
    2
    Thanked 10 Times in 10 Posts

    Default

    make height and line-height same

  7. The Following User Says Thank You to monicasaha For This Useful Post:

    lord22 (11-07-2009)

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •