HTML: Figure Tag

Figure and figcaption tags

figure

Used for including figures with caption (as in a book), typically a illustration, photo, diagram, but can also be video, animation, table, code example, etc.

figcaption

• For figure caption.
• Must be inside figure.

🛑 WARNING: the figcaption tag must be the first or last child of the figure tag.

Example

Code

<figure>
<img src="i/tile_A.png" alt="tile A" width="128" height="128" />
<figcaption>
a tile pattern
</figcaption>
</figure>

figure {
 display: inline-block;
 padding: 0;
 margin: 10px 0;
}

figure > img {
 box-shadow: 3px 3px 8px 4px silver;
}

Browser shows

Browser Support

• As of 2011-07-22, all major browsers support it.
• As of 2011-03-24 Safari (5.0.4) and Opera (11.01) don't support it. Google Chrome (10.0.648.151), Firefox 4.0, IE9, all support it.