NO BUG: CSS Class Priority

Bugs
1

Hello, I ran into an unpleasant problem in the form of css class priority.
I have 2 classes on the element:

  1. header__icon
  2. icon-text
    In the adaptive version, I want to hide the block, I use header__icon styles, since I need to hide elements with this particular class, but the priority of the icon-text class interrupts display:none.

I have attached a screenshot of the problem: Joxi (86 kb) закачан 30 июня 2023 г. Joxi

2

Hi Oleg,
Thanks so much for your report!

The solution to your problem is the order in which you add the classes. You let single classes compete against each other, which have the same specificity. So the order is crucial. Swap the order by adding icon-text first and then header__icon. This should work as expected.

Since these are custom classes, I don’t see how we can flatly counteract this.

Best regards,
timmse

1 Like
3

I tried changing the order of classes on the element itself, but it didn’t help. Apparently, only creating from scratch will help, which is very inconvenient considering that there is already an adaptive and you will have to copy everything.

It would be possible to make it possible to drag classes in the list of all classes to set their order. It would be very helpful. Because, for example, in the code editor, I can just copy and paste from the bottom, but not in the constructor.

4

Yes, that would be wonderful - but it is a highly complex task :exploding_head:
I don’t know of any builder that supports this out of the box.

1 Like