Reduce the spacing between images

Hi I am new to obsidian and css. I am trying to reduce the spacing between two images (see below) in the reading view. I guess I should achieve that through css snippet? Can anyone give me an example of the css code? Thank you!

Snipaste_2023-11-27_04-07-18

What’s the Markdown in your note look like? Is there a blank line between the embeds? You could probably get away with the links one after the other.

![[200x200.jpg]]
![[the-expanse.jpg]]

Reading view:

1 Like

ohh, thank you! the markdown in my notes looks like ! [200] (./clip_image014.png) and the spacing does reduced when I use ! [[ 200 ]].
Do you know what is the reason? I would also love to have a solution using css (for learning purposes I guess).

Using either a Wikilink embed

![[the-expanse2.jpg]]
![[the-expanse2.jpg]]

or a Markdown embed,

![img](the-expanse2.jpg)
![img](the-expanse2.jpg)

I don’t see any gap between the images in Live Preview or Reading views.


However, I did notice a gap in Reading view if you have a space after the first embed (creating a line break, <br> ). It’s hard to notice in the editor.

![img](the-expanse2.jpg)<space>
![img](the-expanse2.jpg)

Have a look here

and using the inspector, see if it’s the <br> creating the space or not. If it’s not that, you’ll have to find out what’s causing the space, and then maybe someone can offer a CSS solution.

thank you very much. I used the inspector and do not see
. On the other hand, I find that the space shows up when I starts a new line for the second embed. If I embed two images in the same line, there is no space.

I am really curious to know what makes the difference between the Live Preview and Reading view.

This topic was automatically closed 90 days after the last reply. New replies are no longer allowed.