I ask a lot of questions (sorry). I’m now building my 7th site using X-Pro and I am trying to become more efficient by using the power of X and coding less. However, there are certain things I just cannot seem to make work and I don’t find the answers in the forum, or in the documentation.
One example is headline and text elements in the page builder. If you view the attached image, you will see I have assigned a custom class to a headline element. In the page builder, I have set this headline to a font-size of 30px. Then, in Options/CSS I am targeting that element on devices that have a max width of 415px to reduce the font from 30px to 25px. No matter what I do, I am unable to get that CSS to take effect. It’s not just on this website, but I have never been able to get the custom classes to work on headline and/or text elements.
If I don’t use the custom class I assigned it, and just target the element with the X-assigned class, (In this example it’s .e6-8.x-text .x-text-content-text-primary) I can get it to react; but if I use my custom class nothing happens. I don’t want to have to target every headline on the site where I want to make this change, which is why I want to add the custom class. I just can’t get it to work.