Bricks Version: 1.4beta
Hi,
Sorry for creating a new thread but the other ones about headings margins are not related to the exact same problem…
I actually had some hard time overriding Bricks global headings margins with custom CSS (same issues either in Bricks settings page or in child theme style.css).
IMHO some global Bricks CSS rules are too invasive, and I’ll try to explain why… please correct me if I’m wrong!
The use of .brxe-heading class to style headings margins prevents us to simply override margins with h1, h2,… {}, which I use a lot in my custom CSS, and which is used in some other CSS frameworks as well.
The .brxe-heading selector is indeed more specific than the generic h1, h2, etc, so we can’t directly override margins unless we use !important, which would be even worse because we couldn’t style any heading with the builder any longer.
In some other thread, it was suggested to use hN.brxe-heading to style headings globally (the issue wasn’t the same but I anticipate some answers!), but it means editing all our custom CSS, and it’s not possible for external CSS frameworks.
Note that the use of .brxe-heading alone is not enough because of the CSS order:
And there’s another major issue, we can’t use other classes to override margins:
Finally, it leads to inconsistencies between builder and frontend (maybe there’s another issue with CSS inclusion?):
So I really think “h1, h2, etc {}” should be used instead of .brxe-heading to style headings globally, so that we can adjust margins the way we like in CSS (raw custom CSS, utility classes, frameworks, etc).
Thanks for reading!
