| Example File | Description |
|---|---|
| demo3.htm | Initial file |
| demo3a.htm | Image with a 5 pixel solid border on all sides |
| demo3aa.htm | Image with different borders |
| ***** | Floating Images |
| imagefloatdemo1.html | Initial file (two images) |
| imagefloatdemo1aa.html | Float left for <img> |
| imagefloatdemo1a.html | Float right for <img> |
| imagefloatdemo1b.html | Adding right and left margins to imagefloatdemo1a.html |
| imagefloatdemo1c.html | Adding clear right to imagefloatdemo1a.html |
| imagefloatdemo1d.html | Adding 5 pixel margin to the images in imagefloatdemo1c.html |
| imagefloatdemo1e.htm | Adding a sentence between the two images of imagefloatdemo1a.htm |
| ***** | |
| floatdemo1.htm | Initial file (image followed by three paragraphs) |
| floatdemo1a.htm | Float right for <img> |
| ***** | |
| floatdemo2.htm | Initial file -- floatdemo1.htm with another image between first and second paragraphs, following the first image |
| floatdemo2a.htm | Adding float: right; styling for <img> (Note: View with varying sized browser windows.) |
| floatdemo2b.htm | Adding clear: right; styling for <img> (Note: View with varying sized browser windows.) |
| floatdemo2c.htm | Adding margins to <img> in floatdemo2b.htm (Note: View with varying sized browser windows.) |
Note: Perhaps the most important thing to understand is that the floated element, first floats up as far as it can, understanding that it can float no higher than any preceding element (e.g. <p>), and then to the right or left as far as it can go, allowing for any previously floated element .
