Setting up some basic styling for left and right aligned images in WordPress.

The left aligned image's standard CSS is {float: left; margin-right: 20px;} and the right aligned image is {float: right; margin-left: 20px}.

This is fine for text wrapping, but causes problems if a right aligned image is placed immediately after a left aligned image, because the margin-right and margin-left make the total width more than the container div, and so the right-aligned image drops down.

WordPress renders these images in a post as;

<p><a><img class="alignleft" /></a></p>

<p><a><img class="alignright" /></a></p>

Is there to use jQuery to target the "alignright" img within its <p> block, only when it is adjacent to a code block that contains an "alignleft" img?

Thanks