I am using a custom theme and then a child theme for the custom theme. I believe the easiest way to overide the themes css is to use _extend.less in the <MYCOMPANY>/<MYTHEME>/web/css/source
directory. This works, however, some of the parent themes rules override the _extend.less rules.
Upon further investigation the less files get converted into "different" css files that load in the wrong order. For example:
_extend.less becomes part of pub...../<MYCOMPANY>/<MYTHEME>/en_AU/css/styles-l.css
The css I'm trying to overide gets loaded in pub...../<MYCOMPANY>/<MYTHEME>/en_AU/css/config_1.css
Which gets loaded in that order so the config_1.css does not get overideen unless I add !impotant
to everythin which we know is not best practice.
So how can I make it so that _extend.less loads last? Or do I need to load a new css file and make that load last? - Please advise on how to do this or reference another post.
Thanks
!important
, you should read about CSS specificity developer.mozilla.org/en-US/docs/Web/CSS/Specificity