Creating an Online Picture Gallery

There are many ways in which you can use the float and clear properties in Web pages to flow text and other elements around floating images and other elements. A particularly good use for this is in creating an online picture gallery, in which image captions and descriptions flow alternatively around the right and left sides of floating photos. I've included an example file, gallery.html, with the other example files for this book; just open it in your text editor and then edit it as shown here to create the example online picture gallery, and then save it as mygallery.html (see Figures 10.14 and 10.15):

Listing 10.2. MYGALLERY.HTML—An online picture gallery
 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" ...

Get Cascading Style Sheets (CSS) by Example now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.