NO BUG: Order + specificity of Bricks' css default styles and Bricks editor css

Hi,
I like to use the possibility to write my own CSS in the Bricks Editor.
Now I have assigned code (figure) to an element and see that Bricks overwrites it with its own styles.

The specificity is on the one hand higher than normally added code and the order of the included css file is done later.

There is already a bug report about the fact that some code is included several times, but I have not yet found one for the problem I have described.

Here a screenshot (yellow highlighted the css editor code):

I think it’s good that Bricks already uses the “where” selector in some cases, why not here?
I also didn’t see that I set these settings myself, but I haven’t used Bricks much and I might be doing something wrong.

Hi JĂĽrgen,
Thanks so much for your report!

Unfortunately, a certain degree of specificity cannot always be avoided and in the case of the figure tag, certain defaults are necessary.

However, you can solve the problem very easily by wrapping the image with a div, adding your class there and setting the HTML tag of the div to figure (do not use the setting on the image itself). This way you detach the figure tag from the image and make it independent and your single class styles work. The markup itself remains identical (figure > img).

Best regards,
timmse

Thanks for your reply and help, timmse!

Yes, I can solve the problem this way, but I would still be happy if the “where” selector for default styles were used everywhere in the future, so that you don’t have to intentionally increase the specificity for your own code.
But it’s no drama for me for now :wink: