What the logic to use figure tag with img

What the logic to use figure tag with img

Like to wrap img element?

<img src="myimage.png">


<img src="myimage.png">

I saw this many times what the advantage to use or not to use it? Any logic? As I got it in half is means when not use figure that way not break layout if image not load is true?


The <figure> tag specifies self-contained content, like illustrations, diagrams, photos, code listings, etc. While the content of the <figure> element is related to the main flow, its position is independent of the main flow, and if removed it should not affect the flow of the document.

^ source

Unless you give the element some fixed dimensions it will not prevent the layout from breaking if the image doesn’t load. It will collapse just like any other container would.

The figure element and the accompanying figcaption element are really more about semantics.