Tools

WordPress IMG alignleft or alignright not working with regular CSS

Many WordPress users who have saluted the new media loading/management utility that came with the 2.7 version text editor are mystified by the fact that the images refuse to align right or left when inserted by using the choices offered by the WYSIWYG editor. The problem is that the utility uses its own CSS, which needs to be manually copied and pasted into the CSS stylesheet of each theme. Right, you heard it right, of each theme. The code that needs to be added can be found below. Copy, go to your blog backend, Appearence>Editor>Stylesheet>Past>Save. Voila, it works. It is not very hard, just tedious.

Enjoy….


/******************************************
* Align box
******************************************/

img.centered, .aligncenter, div.aligncenter {
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;
}

Sorin Adam Matei

Assistant Vice President for Partnerships in Strategic Defense Innnovation and Professor of Communication at Purdue University, Director of the FORCES initiative leads research teams that study the relationship between technological and social systems using big data, simulation, and mapping approaches. He published papers and articles in Journal of Communication, Communication Research, Information Society, National Interest, and Foreign Policy. He is the author or co-editor of several books. The most recent is Structural differentation in social media. He also co-edited Ethical Reasoning in Big Data,Transparency in social media and Roles, Trust, and Reputation in Social Media Knowledge Markets: Theory and Methods (Computational Social Sciences) , all three the product of the NSF funded KredibleNet project. Dr. Matei's teaching portfolio includes technology and strategy, online interaction, and digital media analytics classes. A former BBC World Service journalist, his contributions have been published in Esquire and several leading Romanian newspapers. In Romania, he is known for his books Boierii Mintii (The Mind Boyars), Idolii forului (Idols of the forum), and Idei de schimb (Spare ideas).

17 thoughts on “WordPress IMG alignleft or alignright not working with regular CSS

  • WordPress IMG alignleft or alignright not working with regular CSS | I Think great article thank you.

    Reply
  • WordPress IMG alignleft or alignright not working with regular CSS | I Think great article thank you.

    Reply
  • Sam Morris

    Thanks for this tip, seems really stupid that they didn’t just have this working throughout all themes.

    Reply
  • Thanks for the info man, It worked greatly for me.

    Reply
  • DaveP

    Thanks!

    This CSS worked brilliantly unlike the CSS at the official WordPress Codex which would not do img.alignright properly

    Thanks a million bud.

    Reply
  • This post saved me a lot of headaches while I’m setting up my first WordPress blog. Thanks!!

    Reply
  • Thanks very much to posting this.

    It’s people like you that make the difference when others are stuck on problems. A quick fix without tears to my images.

    Reply
  • Bummer, not getting any results on this in IE.

    Any ideas?

    Reply
  • Thank you very much for this solution.

    Reply

Leave a Reply

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