CSS & HTML Centering Stuff

In this post called “ & Centering Stuff” I will explain how you can easily center text, images and other items in and .

So let’s begin with the text:

/*    This will center the text    */
p {
    text-align: center;
/*    This is also an option inside any class    */
.some-class {
    text-align: center;

Now let’s center an image or a complete block:


/*    for images put img.center    */
.center {
    width: 500px; /* your width in here */
    margin-left: auto;
    margin-right: auto;
    /* adding text-align to center the text */
    text-align: center;


<div class="center">This text is centered inside the centered div.</div>
<img class="center" /> <!-- This image is centered -->

So as you can see, this is really simple and also easy to remember.
I hope this helped you, if so then please leave a comment 😉

6 Replies to “CSS & HTML Centering Stuff”

  1. Hello! I know this is kinda off topic nevertheless I’d figured I’d ask. Would you be interested in trading links or maybe guest authoring a blog article or vice-versa? My blog covers a lot of the same subjects as yours and I think we could greatly benefit from each other. If you happen to be interested feel free to shoot me an email. I look forward to hearing from you! Wonderful blog by the way!

  2. I’m still learning from you, but I’m making my way to the toop as
    well. I certainly love reading everything that is posted on your blog.Keep the information coming.
    I liked it!

Leave a Reply

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