Now I See Why the WordPress Image Align Feature Was Not Working

Daniel Scocco

There is one WordPress feature that was introduced with version 2.5 that always made me curious: the image alignment feature of the “Add media” editor. Why? Because it never worked!

I knew that I was probably doing something wrong, but since I didn’t have time to find it out, I just kept choosing “none” as the alignment, and then I would manually insert the right, left or center alignment attribute on the image tag.

Then last week when I was submitting one of my themes for the WordPress Themes Directory I got a message saying that since version 2.5 WordPress themes were required to have the following code on their stylesheet:

img.centered {
display: block;
margin-left: auto;
margin-right: auto;
}

img.alignright {
padding: 4px;
margin: 0 0 2px 7px;
display: inline;
}

img.alignleft {
padding: 4px;
margin: 0 7px 2px 0;
display: inline;
}

.alignright {
float: right;
}

.alignleft {
float: left;
}

Duh! That is why the alignment feature was not working on my blogs, I never added that code! Now if you faced this problem in the past, now you know how to solve it.

Browse all articles on the WordPress category or check the recommended articles for you below:

78 Responses to “Now I See Why the WordPress Image Align Feature Was Not Working”

  • Beno

    I was doing a Google search trying to find out why WordPress wasn’t doing the right thing by default and I came across this post.

    Thank you for sharing.

  • Schrottpresse

    Thank you very much for this solution, I really was confused with all of the align functions on the button bar, none of them working ^^

  • BloggerNewbie

    Daniel:

    worked! (no surprise) Saved a ton of work! Sometimes I use scribefire which lets you position graphics a little better. It has it’s benefits and drawbacks.

    Thanks. Always helpful.

  • Coder

    I never had this problem..
    Don’t know why?! LOL

  • خسروبیگی

    Hello

    Thanks for your solution. I had this problem too and your post help me.

    Regards

  • Jodith

    *nods* I just had to have that fight with my theme last week (when I finally updated to 2.6 from 2.3.1). Drove me crazy getting it figured out, but I finally got it in there and can now float my text around my images.

    And there was much rejoicing!

  • Melodee Patterson

    I hate to say all those hours I spent figuring out how to align my graphics were a waste, but, doh!

    Thanks!

  • BloggerNewbie

    Well No duh here cause it’s all news to me, except the part that the alignment never worked, too much of a newbie to even begin to know how to work on it. I’ll check it out and report back on my success (positive thinker) 🙂

  • parisb

    @Daniel: Thanks. I did try that immediately when I saw this tip. It still isn’t working though. Is there a specific part of the stylesheet it should go into? I’m still aligning my images manually 🙁

  • pandu

    oh…gosh, i always find difficulties when aligning image on my blog. you’re really ‘the daily blog tipper’, man…muchos gracias!

  • Daniel Scocco

    @Parisb, open WordPress CP, then Design, then Theme Editor, then open style.css file. Place it there.

  • parisb

    I’m wondering where to place this too? I’m using the passionduo theme and the images aren’t aligning. Thanks for any help.

  • EL Locco

    Yach, really I like this article. Thanks for this nice article 😀

  • David Hutchison

    Thank you! There doesn’t seem to be a blogging question that can’t be answered by our supportive community – quietly working alone at home, yet I don’t feel isolated.

  • Michelle

    Daniel, you’re an absolute star. I’ve been struggling with this issue for months!

  • Ari

    Thank you Daniel, it really helps.
    @ Annie, you need to put the code at stylesheet file of your theme on the content section.

  • Hillary

    Oh man!!! Thanks for sharing this, what a time-saver.

    Like you, I’ve been aligning my images manually. Lol!

  • Allyn

    OK, so I am the only one who does not know where in the stylesheet to put that code.
    does it matter where you put it?
    help!
    thanks,
    AL

  • Rick

    I actually caught this myself. I always compare the latest default theme with the previous one. That way I catch any theme updates I need to propagate to my theme (which is based on the default).

  • Annie

    AHA! That’s the problem! Thanks for sharing the proper code. Now, where exactly do I put it? I’m just beginning to learn about this stuff . . .

    Thanks!

    ~ AA

  • Brad Blogging.com – Personal Blog Tips And Blog Help

    It was so annoying adding an “float:left;” to each one of my pictures.

    Thanks for the code!

  • Todd Andrews

    Wow, I’ve been coding a work-around for this for a while now. They need to make this standard with all WP themes someday

  • Ellie

    Thanks so much, that was an annoying problem.

  • stetoscope

    GREAT, I HAD THIS PROBLEM TOO.
    THANK YOU VERY MUCH

    (DO YOU HOW TO WRITE WITHOUT CAPS ;-)))

  • Dean Saliba

    I had this same problem, thank you for the solution.

  • DjFlush

    lol and I kept thinking this was a problem with my blog only. Thanks Daniel! It works

  • Stephen

    I better go check my theme’s stylesheet. Mahalo for the info.

  • Arjen

    Thanks! I’m going to add these code to my theme.. have been wondering why it wasn’t working!

  • David Lau

    Thanks, i got the same headache problem,and now it’s working~

  • XIII

    Big doh moment, thanks for the tip. Me thinks WordPress themes seem to have a hard time keeping up with new WordPress features.

Comments are closed.