sigrunixia
commented
1 year ago The inconsistency between Live Preview and Reading mode is due to the different rendering processes which govern those two. There is some CSS snippets out there to attempt to fix it for things like headers and paragraphs, but it's quite like fighting a losing battle.
Additionally, depending on the theme you are using, there can be styling on top of that.
The specific selector for block quotes within admonitions on live preview is:
body > div.app-container > div.horizontal-main-container > div > div.workspace-split.mod-vertical.mod-root > div > div.workspace-tab-container > div > div > div.view-content > div.markdown-source-view.cm-s-obsidian.mod-cm6.is-folding.is-live-preview.node-insert-event > div > div.cm-scroller > div.cm-sizer > div.cm-contentContainer > div > div.cm-preview-code-block.cm-embed-block.markdown-rendered.admonition-parent.admonition-info-parent > div.callout.admonition.admonition-info.admonition-plugin.is-collapsible > div.callout-content.admonition-content > blockquote
Give or take a few divs. You would target a css snippet with .is-live-preview.admonition-content { for any admonition content (body) styling, and .is-live-preview .admonition-content blockquote {for blockquote styling. For spacing, you are typically looking at altering the margin and padding properties.
Admonitions now comes with this by default which should solve the issue you were experiencing. If not, then specifically targeting as mentioned above will take care of the rest.
.is-live-preview .admonition-content>* {
margin-top: 0;
margin-bottom: 0;
}
I am having a problem with quote inside admonition in Live Preview mode. It renders abundant spaces 😢
Editing:
Reading:
but in Live Preview:
How can I fix this problem? Thank you!☺️