Question theme css overriden by elementor frontend.min.css

[birdy]

Hi all,
First Thanks for this forum, it is an excellent idea, elementor ticket system is sometimes not the best system to share tips and find help.
I currently use hello theme and elementor pro. I'm still editing my custom css styles in my theme folder to have some consistency across my site for elementor pages and standard. My problem is the following: everytime I edit styles in my custom.css theme file they are overriden by frontend.min.css. If '!important! flag is not used, I have no way to style my pages. Frontend.min.css override my styles in the elementor editing panel and in preview mode, in the theme customizer and also online.

Did you find a solution or hae a suggestion ?

 

[birdy]

You know it , .... when you ask the question it's because you're not far away to have an answer :-D
Ok for those that will come to the forum and look here, I use a (bit) dirty trick to place my styles above frontend.min.css without using !important flag everywhere:
in theme functions.php I put this:

function wp_body_classes( $classes )
{
$classes[] = '" id="the-id-name-you-choose"';

return $classes;
}
add_filter( 'body_class','wp_body_classes', 999 );

and in my theme css file, I prefix all my custom styles with "#the-id-name-you-choose" like

#the-id-name-you-choose h1 {
line-height: 5;
}

Yes a bit dirty but working, If you have a better solution, you're welcome

 

[rpuigdel]

Hello, thanks for this solution! I am so sad that Elementor team is not able to propose a solution themselves. ,its been a year since I ve seen this issue notified! Sadly it does not work for elementor classes . Thanks anyways

 

[rpuigdel]

I think I have found a solution, you need to set elementor settings to use external css file , not embedded, then it seems it loads the elementor css after the frontend.css.min, which was the culprit . Hope im right