WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. Join them; it only takes a minute:

Sign up
Here's how it works:
  1. Anybody can ask a question
  2. Anybody can answer
  3. The best answers are voted up and rise to the top

I want two images to appear side-by-side. However, WordPress inserts a line-break between the elements, even if I use the HTML editor rather than the Visual editor.

How can I make the editor trust that if I don't insert a line-break, I don't want it?

share|improve this question
Can you post the code the editor outputs to the browser? Is this line break an actual <br /> tag or just unwanted whitespace? It could actually be a theme CSS issue, and not a WordPress editor issue ... – EAMann Aug 22 '10 at 14:34
It was an actual <br />. – mac9416 Aug 24 '10 at 11:29
up vote 3 down vote accepted

To avoid the line break when posting 2 images side by side assign the alignleft or alignright class to them and put them on the same line in the editor without skipping any spaces between them.


<img src="/wp-content/uploads/your_image.jpg" alt="" class="alignleft" /><img src="/wp-content/uploads/your_image2.jpg" alt="" class="alignright" />

Edit I forgot to mention that content after the floated images will overflow between the images unless you clear the floats. I add: <div class="clear">&nbsp;</div> after the images and add .clear {clear:both;} to my css.

share|improve this answer

Along with what @Chris_O said, when you are in the editor for the pictures select Left on one and Right on the other. This applies the alignleft and alignright classes, respectively.

Your theme has to have the CSS classes defined, if you have one from vendor, they are more then likely there, but in case they aren't, just go into the theme editor and add them to the CSS:

.alignleft {float:left;}
.alignright {float:right;}

I also like to add something like this for the images I float, since the test might wrap around them;

img.alignleft, img.alignright {
padding: 5px;
display: inline;

Obviously you can add margin or changing the padding to suite your taste.

share|improve this answer

Your Answer


By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.