How can I make the width of my match the width of the inside its tag?

Adding this Code to <figure> and <figcaption> CSS-Attributes helped me with the same problem. Also, it preserves the responsivenes of your images and captions.

figure { display: table; }


figcaption { display: table-caption; caption-side: bottom ; }

1. Adding display: table; sets the stage.

2. Adding display: table-caption; alone placed the caption on top of
   the image, The caption-side property specifies the placement of
   the table caption at the bottom, top is default.