www.webdeveloper.com
Results 1 to 2 of 2

Thread: Vertically Centering Image

  1. #1
    Join Date
    Jan 2014
    Posts
    1

    Vertically Centering Image

    I'm trying to vertically center this logo on my responsive navigation bar and keep its relative positioning. I have tried using the vertical-align and table-cell in different ways, but have not succeeded.

    The image below shows that the logo is not vertically centered (not too obvious but you can still see a gap at the top where the 9 blobs are).

    http://oi57.tinypic.com/2am0wh.jpg

    Please go to http://www[dot]acmfootball[dot]com/navs/nav1/ if you want to view or experiment with the code.

    This is my CSS code at the moment that dictates the mobile navigation logo.

    Code:
    #acmcentral {
    		
    	display: block;
    	margin: 0 auto;
    	display:inline-table;
    	vertical-align:middle;
    		
    	}
    	
    #acmcentral img {
    	display:table-cell;
    	vertical-align:middle;
    	/*height:28px;*/
    }
    Any help much appreciated for this small but annoying issue.

  2. #2
    Join Date
    Jan 2014
    Posts
    11
    You can try to wrap the image and text in a <div> and do a margin-top: -5px;

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles