NO BUG: Duplicated element's default CSS while using in templates

I’m not sure wheather is this issue the same as the one here WIP: Why does Bricks write the same CSS rule multiple times?, but maybe it’s a different one.

When I use a Nav Menu element in several templates, it outputs its default CSS settings multiple times. I’m talking about it’s default’s Bricks settings, not my custom styles added via settings.

I have a page with a header, pre-header (populated via hook), footer and some content. In each of theses parts there’s a different menu. And every part adds another duplicate of the very same CSS for the default menu settings.

Here you can see the rules for backgound color (I have change it to white in my child theme’s CSS):

The default CSS for the Nav Menu is 375 lines, so it’s more than 1000 lines of redundant code just for one element. Not sure wheather it’s Nav Menu specific or if it is the issue for every element.

And the final note: this happens only when External CSS loading method is on.

Thanks for looking into it.

1 Like

Hi I would like to add, that I wrote about unecessary CSS as well before in Nav Menu element generates unnecessary CSS. Maybe Bricks Team will take a look soon.

Hi Petr,
Thanks so much for your report!

As far as I can see, it’s rather a bug but more an improvement request. Each template has its own CSS file, so if each template contains a nav menu element, the styles will be added. Currently, we’re not checking if there is already a menu, as this kind of check is super complex, as you might guess.

@MartinWB You have created your request in the correct category, as the styles are currently not created depending on the breakpoint settings, but always. This would be much easier to solve in the future than the “problem” in this report here, but the few additional styles are certainly not a problem and should have very little impact on the performance of your website.

Best regards,
timmse