StackOverflow2013

Note that there are some explanatory texts on larger screens.

plurals

PO
text
Body
copied!<p>An <code>img</code> is not required in a <code>figure</code> element, it just happens to be common, and most examples that use <code>figcaption</code> also have an image.</p> <blockquote> <p><a href="http://dev.w3.org/html5/spec/single-page.html#the-figure-element">http://dev.w3.org/html5/spec/single-page.html#the-figure-element</a></p> <p>The <code><figure></code> element can thus be used to annotate illustrations, diagrams, photos, code listings, etc, that are referred to from the main content of the document, but that could, without affecting the flow of the document, be moved away from that primary content, e.g. to the side of the page, to dedicated pages, or to an appendix.</p> <p><a href="http://dev.w3.org/html5/spec/single-page.html#the-figcaption-element">http://dev.w3.org/html5/spec/single-page.html#the-figcaption-element</a></p> <p>The <code><figcaption></code> element represents a caption or legend for the rest of the contents of the figcaption element's parent figure element, <strong>if any</strong>.</p> </blockquote> <p>Note the "<strong>if any</strong>" part, which leads me to believe that content other than the <code>figcaption</code> may not exist and it will still be valid. However, as Alochi notes, it suggests a misuse of the element since there is no content for the caption to describe.</p> <p>There <em>is</em> an example in the current specification example of non-image content being accompanied by a figcaption, so I think it's fair to assume it's perfectly OK to not have an image:</p> <blockquote> <p>Here, a part of a poem is marked up using figure.</p> <pre><code><figure> <p>'Twas brillig, and the slithy toves<br> Did gyre and gimble in the wabe;<br> All mimsy were the borogoves,<br> And the mome raths outgrabe.</p> <figcaption> <cite>Jabberwocky</cite> (first verse). Lewis Carroll, 1832-> 98 </figcaption> </figure> </code></pre> </blockquote>

Querying!

Guidance

An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload