How to Vertically Align Text Next to an Image Using CSS
Topic: HTML / CSSPrev|Next
Answer: Use CSS vertical-align Property
You can simply use the CSS vertical-align property with the value middle to vertically align the text which is next to an image (e.g. user profile or avatar icon before name, etc.).
Let's try out the following example to understand how it basically works:
Example
Try this code »<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Align Text Next to an Image Vertically</title>
<style>
img{
vertical-align: middle;
}
</style>
</head>
<body>
<p>
<img src="images/diamond.jpg" alt="Avatar" />
Vertically aligned text
</p>
</body>
</html>Related FAQ
Here are some more FAQ related to this topic:
