Image captions: caption width to match image width

[m.scheminger]

What I’m trying to do

I’m trying to use the plugin Image captions. However, the caption takes up the whole line width making it impossible for other images to fit in the same line.

I want the caption to match the image width.

Things I have tried

Tried targeting image-captions-figure and image-captions-caption with stackoverflow solutions like so:

.image-captions-figure {
    display: table;
  }
  
image-captions-caption {
    display: table-caption;
    caption-side: bottom;
  }

Didn’t work. Does anybody have a solution? Thank you in advance!

[m.scheminger]

Got it working with this code:

figure {
  display: table !important;
  margin: 0 !important;
}

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

However, images are still in two seperate lines:

What can I do to let them appear in the same line like so?

Thanks again!

[AlanG]

@m.scheminger you don’t need the CSS snippet, you just need to update the plugin - the issue you’re experiencing was fixed last week:

Release 1.1.0 · alangrainger/obsidian-image-captions

Regarding images in a row - the CSS doesn’t do that yet but I’ll have a look at it.

[AlanG]

@m.scheminger inline images (same line) are now fixed in v1.1.1.

[m.scheminger]

Thanks! Updated, but doesn’t seem to work:

With caption:

Without caption:

Thanks again!

[AlanG]

Just make sure you’re on 1.1.1, and don’t forget to delete your old snippet

[m.scheminger]

Works like a charm! Thank you so much!