Open chrisbrasington opened 9 months ago
Hey, I have the same issue. Mac OS 14.1, iOS 16. Tony
Looks like the obsidian-banner-wrapper
element needs to be at the top of the markdown preview, but a markdown-preview-pusher
element gets added even before that.
As a workaround, I added a CSS snippet to the Appearance Settings:
.obsidian-banner-wrapper {
margin-top: calc(var(--banner-height) - 200px);
padding-top: 0.5em;
}
It works fine on Mac OS but doesn't make any difference on iOS.
Not sure why it took me so long, but, adding !important to the snippet got the work around sorted for iOS:
.obsidian-banner-wrapper {
margin-top: calc(var(--banner-height) - 200px) !important;
padding-top: 0.5em;
}
Of course, this is only a workaround, and you'll need to adjust for the height you have your banner set.
I've written the following CSS snippet workaround
.obsidian-banner-wrapper {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: var(--banner-height);
margin-top: 0;
padding-top: 0;
}
.obsidian-banner{
position: relative;
}
.markdown-preview-view:has(.obsidian-banner-wrapper) {
padding-top: calc(var(--banner-height) + var(--file-margins));
}
before | after |
---|---|
[!warning] This fix does not work in preview embedded. Disable the
Show banner in preview embed
option in the Banner plugin settings
My simple fix (it works best for me in preview and in embed)
.obsidian-banner-wrapper {
margin-top: 0;
}
Obsidian: v1.4.16 Banners: 1.3.3
Reproduce: To ensure I didn't have any conflicting plugins/css, I can reproduce this on a new vault.
Issue: Banners add too much white-space padding below the banner after editing any page. Disable/Enable plugin will remove the spacing. Not able to use banners in the meanwhile.
Notice how the "hello" shifts down. Issue persists at all times after first appearance.
Before edit:![image](https://github.com/noatpad/obsidian-banners/assets/1186896/318d9324-b4ce-4967-8707-445e9b6a5432)
During edit:![image](https://github.com/noatpad/obsidian-banners/assets/1186896/928ab9e5-75ad-46cc-89e8-65efe0b43d23)
After edit:![image](https://github.com/noatpad/obsidian-banners/assets/1186896/48f2eaae-f4bc-4d23-b745-4be51a8bf09f)