Anyone can code html, or download a program to do it for you and push buttons. Being good at it, making it cross browser compatible, accessible, and index well in search engines is another story. It requires awareness of and implementation of W3C standards and WCAG accessibility guidelines, most of which button pushers won't do.
To answer the Q, what you want is the float property. Wrap the image in a div, or apply the float property directly to the image. The div is often better as it allows you to add captions as a whole chunk. Examples:
<style type="text/css">
.left-float { float: left; padding: 6px; }
.right-float { float: right; padding: 6px; }
</style>
A div example:
<div class="left-float"><img src="yourimage.jpg"></div>
<div class="right-float"><img src="yourimage.jpg"></div>
Image only:
<img class="left-float" src="yourimage.jpg">
<img class="right-float" src="yourimage.jpg">
- The above CSS will work for both the div and the image example, since we have defined a generic class that applies to any element.
- When floating left AND right as above, always put the left float first.
- When floating in ANY case, the floated element has to have something to float around. So this will work:
<div class="left-float"><img src="yourimage.jpg"></div>
<div class="right-float"><img src="yourimage.jpg"></div>
<p>This is your content. This is your content. This is your content. This is your content. This is your content. </p>
The images will be left and right with the paragraph flowing around them. This will not:
<p>This is your content. This is your content. This is your content. This is your content. This is your content. </p>
<div class="left-float"><img src="yourimage.jpg"></div>
<div class="right-float"><img src="yourimage.jpg"></div>
The images will still be left and right, but below the paragraph.
Inline styles can also be used, not recommended:
<div style="float:left; margin:6px;"><img src="yourimage.jpg"></div>
<div style="float:right; margin:6px;"><img src="yourimage.jpg"></div>
The reason being, the whole foundation of CSS is to separate markup from content.
So there you have it, "good" html/css code.
