I just noticed that Microthemer adds a mt-{{page_id}} class to the body element. When using Tailwind CSS, this is the same as theirs mt-14 for instance, which effectivily adds a margin-top of 56 pixels to the body.
Thanks for bringing this to my attention. How annoying! One way around this would be to set the body margin-top property to zero using the following selector:
body[class*="mt-"] {
margin-top: 0px;
}
The above selector would override the .mt-14 tailwind class by having slightly higher CSS specificity.
If that isn’t workable for some reason, MT would need to make the format of the page-id class configurable.
I’m good. I added the necessary CSS in the end so there’s actually no problem. And it only will be a problem if the page has an id of 96 or less. But, I took me a bit before I figured it out what was happening 🙂
Best,
Koen.
UPDATE – version 7 fixes this by using mtp-123 for page classes. You can manually change this via the preferences when upgrading from version 6, as it won’t change automatically (to ensure existing selectors work as usual).
If changing the class prefix from “mt-” to “mtp-” Just bear in mind that you will need to manually update all of your selectors. The folder search feature will help with this. There is no replace feature as of yet, but this will come in time.
Thanks Sebastian for getting back to me on this and for your software that keeps on rocking. Whenever I have the chance I try to be an ambassador for Microthemer.
best.
