Jump to content

Trouble Adding Padding To An Image...

Recommended Posts

I am trying to align an image with text in my header... here is my page:header.gifI want the Customer Login to move down about 5-10 pixels so that is lines up with the text. I've tried adding padding and margins but it breaks onto two lines. What is the best way to go about doing this?Here is my CSS:

.headerSubpages {margin: 0 auto; width:960px; height:104px; margin-bottom: 20px;}.headerLeftSubpages {width: 300px;float: left; }.headerSubpagesCenter {padding-top:40px; text-align:right;}

And the HTML:

<div class="headerSubpages">	<div class="headerLeftSubpages"><a href="http://<%= Request.ServerVariables("SERVER_NAME") %>/default.asp"><img src="/spsite/navigation/images/hg_splogo300.gif" width="300" height="104" border="0" align="left" /></a></div>	<div class="headerSubpagesCenter">Need Assistance?   1.877.954.7873   /   <a href="#">Free Payroll Quote</a>   /   <a href="#">Enroll Now</a>   /	<img src="/spsite/navigation/images/headerCustomer_login.gif" /></div>	</div>

Thank you for your help,

Link to post
Share on other sites

Why don't you move the text up so it sits in the middle using vertical-align: middle; ?

Link to post
Share on other sites
Thanks for the suggestion, but I added vertical-align:middle to .headerSubpagesCenter and there was no change on the page.
But I added this to the CSS: .headerSubpagesCenter img {vertical-align:middle;} And the image aligns now! Thank you for your help.
Link to post
Share on other sites

Edit: ah, got there fast. :)

Edited by chibineku
Link to post
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

  • Create New...