Embedding a Callout removes space below Callout title

[Olondre]

Steps to reproduce

1. Open Sandbox Vault
2. Create a Callout
3. Embed that Callout

Expected result

I would expect the space below the Callout title to be the same when I embed it.

Actual result

This happens in Live Preview and Reading View.

Environment

• Operating system: Windows 10

---

[WhiteNoise]

thanks

[yaozhuwa]

The space between the callout and text also be wrongly removed in embed markdown block of Live preview mode.

expected:

[Sarilunaris3]

Indeed, it happens to me when embedding a note that has various callouts one after the other; they all run into each other without spaces in between.

Example:

Note with callouts:

Note with embedded section:

I’ve ignored it since I’m more focused on the information but then I saw this post, so I’ve added another example on how it can look off.

[MrGreen]

Hi, I also have come to this issue and wrote a small snippet as a workaround.

.inline-embed .markdown-embed-content .callout-content p {
  margin-top: 1em !important;
}

I also added another small fix to realign the small link button which you can add:

.embed-title.markdown-embed-title:empty {
  display: none;
}

[MrGreen]

I can’t edit my previous reply for some reason. Here is a workaround that kinda works for the missing space between callouts:

.markdown-source-view.mod-cm6 .callout {
  margin-bottom: 1em;
}

[ariehen]

I took screenshots and wrote this up before finding this report, so might as well post it:

Steps to reproduce

1. In the Sandbox, create noteA with this content:

Clap of thunder rope's end red ensign Barbary Coast broadside ye Plate Fleet.

> [!example] Title
> Pirates of the Obsidian!

Careen loot driver scurvy maroon take a caulk barque topgallant squiffy.

2. Create noteB with this content:

Chase guns strike colors fluke barque Sea Legs boom maroon code of sutler gun.

![[noteA]]

Piracy fire in the parley shrouds gangway black jack belay American Main matey Letter of Marque. 

Did you follow the troubleshooting guide? Y

Expected result

The margins and paddings of the original callout is maintained if embedded.

Actual result

• In Live Preview, the callout-content looses its padding and the entire callout looses its bottom margin.

• In Reading view, only the callout-content is loosing the padding.

Environment

macOS v14.4.1

SYSTEM INFO:
	Obsidian version: v1.5.11
	Installer version: v1.5.8
	Operating system: Darwin Kernel Version 23.4.0: Fri Mar 15 00:10:42 PDT 2024; root:xnu-10063.101.17~1/RELEASE_ARM64_T6000 23.4.0
	Login status: logged in
	Catalyst license: supporter
	Insider build toggle: on
	Live preview: on
	Base theme: adapt to system
	Community theme: none
	Snippets enabled: 0
	Restricted mode: off
	Plugins installed: 0
	Plugins enabled: 0

RECOMMENDATIONS:
	none

---

Additional information

I don’t know if this is the best approach, but these snippets appear to keep the proper margin and padding for embedded callouts.

.inline-embed .markdown-embed-content .callout {
    margin-block-end: var(--p-spacing);
}

.inline-embed .markdown-embed-content .callout-content > p:first-child {
    margin-top: var(--p-spacing);
}

[CluelessProductivity]

I found this because I’m looking for a way to remove the space and have them connect without the white space. I am not that knowledgeable on .css, can you explain to me where I would put the code if I did not want to have the whitespace between the callouts on a specific note. Also, what is the difference between a callout and an embedded callout? Thank you in advance!