Align text vertically next to an image

Bring new life into your CSS

Need to Align text vertically next to an image? Here is a simple way to align text vertically that is also next to an image.

Actually, this is quite simple. Apply the align to vertical to the image. Since it is all in one line, so, this is really the image that you want aligned rather than the text.

Suppose, you have a image tag and a text next to the image. So, wrap both within a div.

For example, you have below image tag:

<img src="image.jpg">

And a text:

<span style="">This is working</span>

Read Also: Horizontally center a div within a div

So, wrap both in a div and apply the below css rule.

<div>
<img src="image.jpg" style="vertical-align:middle;">
<span style="">This is working</span>
</div>

Result:

Align text vertically next to an image

You may like:  Columns using CSS3

Leave a Reply

Your email address will not be published. Required fields are marked *