Announcement:

  Hello, We Changed Our Cloth, How It Is Looking? Leave Your Feedback At Our Page.

Sunday, December 30, 2012

How To Center An Image Or DIV To Horizontally Using HTML5?

This Article Was Live On: Sunday, December 30, 2012 And Till Now HaveNo comments.
How To Center An Image Or DIV Using HTML5?

If You Want To Center An Image Or A DIV In HTML File. You Have Two Ways To Place That In Center, One Is Simple And A HTML Tag But It's Not Valid For HTML 5, As There Is A Major UpDate In HTML Version, So Many Of Professional WebMaster Are Leaving Old Style Because That Is Also Against Valid Rules And Give You Error If You Ty To Validate Your Code, So Use The New Code To Center It That Is A CSS Code. I Am Providing You Both Code And Now It's UpTo You What You Use.

Use Any Method From The Following Methods To Center An Image Or A DIV, I Prefer To Use HTML5 Valid Syntax (Second Method). For This You Need To Add CSS Attributes To IMG Or DIV Tag. You Can Also Add Border To Image And Many Other Effects Using CSS With HTML. It Is Also Best For SEO Because After Many Updates In SEO, It's Also A Targeted Factor For Better SEO.

Two Methods To Center Horizontally An Image In WebPage:

1.) Using Center Tag, This Is Not HTML5 Valid Syntax. But This Code Center An Image.
<center><img src="ImageURL" alt="Alt Text" title="Image Title" width="128" height="128"/></center>
2.) By Adding CSS Attribues Auto Margin And Block Display (Image Is An Inline Element Change It To Block Element). This Is HTML5 Valid Syntax.
<img style="margin:0px auto;display:block" src="ImageURL" alt="Alt Text" title="Image Title" width="128" height="128"/>


Two Methods To Center Horizontally A DIV In WebPage:

1.) Using Center Tag, This Is Not HTML5 Valid Syntax. But This Code Center An DIV.
<center><div>Your DIV Data</div></center>

2.) By Adding CSS Attribues Auto Margin And Block Display (Image Is An Inline Element Change It To Block Element). This Is HTML5 Valid Syntax.
<div style="margin:0px auto;display:block">Your DIV Data</div>

Conclusion:

No it's up to you what you want to use to center your object, I am here only to clear the difference not to pressurize you, thanks for reading this, please leave your views and quires in the comment section.

You Like It, Please Share This Article Using...




Don't Forget To Read This Also...



No comments :


Speak Your Mind:



Please Read The Rules Before Commenting:-

1.) Your feedback is always appreciated. We will try to reply to your queries as soon as time allows.
2.) Make sure to click the "Notify me" link below the comment to be notified of follow up comments and replies.
3.) Please "Do Not Spam".
4.) Please "Do Not Add Links" to the body of your comment as they will not be published. If the quires contain link then never add HTML tag to it.
5.) Only "English" comments shall be approved and answered.
6.) If you have a problem check first the comments, maybe you will find the solution there.
7.) Your comments must contain 100+ characters to remain accepted.
8.) Never Use Keywords In The Name Section Otherwise Your Comment Will Be Deleted.
9.) All comment will be deleted if it will not fulfil the requirements.