Tuesday, September 25th, 2007
…. would you hold it against Aaron Gustafson? Aaron has written about “laying out images consistently within a design is difficult; especially when you hand the keys over to someone else to fill in the content.”
The article discusses a microformat for figures so you define a figure using as little or as much as:
- <div class="figure">
- <img src="fa.jpg" alt="" />
- <p class="credit"><abbr class="type"
- by <cite>Aaron Gustafson</cite></p>
- <p class="caption"><em class="title">Figure 1</em>
- The “Faces of the Fallen”
- exhibit at Arlington National Cemetery.</p>
FigureHandler which will:
- Parse the page looking for div elements classified as â€œfigure,â€
- Compare the width of the image within that figure to the overall column width (assumed to be the figureâ€™s parentNode),
- Apply a class to the figure that corresponds to the percentage of the column width the image takes up,
- And, as an added bonus, FigureHandler will also adjust the widths of any paragraphs within the figure to match the width of the image, so you never have to worry about the text and the image not aligning properly.
Posted by Dion Almaer at 7:00 am