Vertically align text next to an image?

Question

Aryan Kumar · Answer

To vertically align text next to an image, you can use CSS flexbox layout. Here's an example:
HTML:
andlt;div class="container">
 andlt;img src="example.jpg" alt="Example Image">
 andlt;p>Lorem ipsum dolor sit amet, consectetur adipiscing elit.andlt;/p>
andlt;/div>
CSS:
.container {
 display: flex; /* Set the container to use flexbox layout */
 align-items: center; /* Vertically center the items in the container */
}
img {
 margin-right: 10px; /* Add some space between the image and the text */
}
In this example, the container is set to use flexbox layout with the display: flex; property. The
align-items: center; property is then used to vertically center the items in the container.
The img element is given a margin-right property to add some space between the image and the text.
You can adjust the values of align-items and margin-right to get the desired alignment and spacing between the image and the text.

forum

Vertically align text next to an image?

Utpal Vishwas

Can you answer this question?

1 Answers

Liked By