Want to be able to drop images into your HTML with a minimum of effort? Set up two little classes in your CSS file to do just that.

1. Open your CSS file.

2. Add in a new class like so: img-left {float: left; padding: 8px 8px 8px 0;}

3. Add in another new class: img-right {float: right; padding: 8px 0 8px 8px;}

(Note: Change the padding as you see fit, this is just a suggestion!)

4. Within your markup, add in your image just in front of the text and then put a div with a class of “img-left” or “img-right” around it depending on whether you want your image to the left or right of your flowed text.

mountains at sunset

Here’s an example of this in action using “img-left.”