Jump to content

Vertical-align <span> Inside <td>


johnnyg24
 Share

Recommended Posts

I am trying to vertically align a <span> inside a table cell. The cell's high is 60px because there is an image in the cell also. I have tried setting the <span> style to "vertical-align:middle" but this doesn't seem to work. What am I doing wrong?The HTML is :

<table><tr><td><img height="60" width="60" src="Picture"/><span class="description">Image Name</span></td></tr></table>

The CSS is :

.description{vertical-align:middle;}

Link to comment
Share on other sites

you could insert text into another adjoining cell on the same row<table border="1" cellpadding="0" cellspacing="0"><tr><td><img height="60" width="60" src="1cha_imgash_thumb.gif" /></td><td><span class="description">Image Name</span></td></tr></table>ORif it is one line of text try:<style type="text/css">table td img{float:left;}.description{line-height:60px; height:60px; float:right;}</style>

Edited by dsonesuk
Link to comment
Share on other sites

better solution<style type="text/css">table td.imgcell img {vertical-align:middle;}.description{display:inline-block; vertical-align:middle;}</style><table border="1" cellpadding="0" cellspacing="0"><tr><td class="imagecell"><img height="60" width="60" src="myimage.gif" /><span class="description">Image Name</span></td></tr></table>

Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
 Share

×
×
  • Create New...