SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Enthusiast Ciwan's Avatar
    Join Date
    May 2010
    Posts
    77
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Exclamation Centre Links Vertically within List

    Hello Friends

    I am trying to centre anchor tags vertically within list tags. Here is what I currently have:



    And here's the HTML and CSS for the above:

    Code:
    <nav>
    	<ul>
    		<li><a href="#">one</a></li>
    		<li><a href="#">two</a></li>
    		<li><a href="#">three</a></li>
    	</ul>
    			
    </nav>
    Code:
    nav ul li {
    	display: inline-block;
    	height: 370px;
    	width: 198px;
    	background-color: red;
    	-webkit-border-radius: 10px;
    	-moz-border-radius: 10px;
    	border-radius: 10px;
    }
    
    nav ul li a {
    	text-decoration: none;
    	color: #000;
    	font-size: 40px;
    	width: 198px;
    	height: 50px;
    	vertical-align: middle;
    	display: block;
    }
    As you can see the links are not vertically centered within the <li> element. Even though I had used the { vertical-align } property.

    I would greatly appreciate any help.

    Thank You.

  2. #2
    Barefoot on the Moon! silver trophy Force Flow's Avatar
    Join Date
    Jul 2003
    Location
    Northeastern USA
    Posts
    4,615
    Mentioned
    56 Post(s)
    Tagged
    1 Thread(s)
    Visit The Blog | Follow On Twitter
    301tool 1.1.5 - URL redirector & shortener (PHP/MySQL)
    Can be hosted on and utilize your own domain

  3. #3
    SitePoint Enthusiast Ciwan's Avatar
    Join Date
    May 2010
    Posts
    77
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you Force Flow, I had actually visited that link before through Google. But I only read the top bits .. the actual solution is further down.

    Thanks once again


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
  •