Aligning Image to the center of the page(without any container).

We usually use  text-align CSS property on the container to set the alignment of the child elements. So in case of <img> tag we can take help of a block container element e.g div or span(the span must have display:block as its style) in the following way:

<div style="text-align:center">
<img src="1.jpg">
</div>

But the code seems redundant because we need only to center the image and for that we need a container!!!

There is a way out…

You can simply use 2 CSS attributes i.e display and margin. Below there is the syntax:

<img src="1.jpg" style="display:block; margin:auto;">
Advertisements

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s