How can I make the page editor trust me?

Question

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?

Answer 1

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.

Example:

<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.

Answer 2

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.