Jump to content
Sign in to follow this  
klikwebdesign

Can't see the effect by changing Style.css of child theme

Recommended Posts

klikwebdesign

If I update my css by modifying style.css of PlatformBase by adding: #footer { background-color: #66CCFF; color: #FFF; text-shadow: none; } the "text-shadow" and "color" effects don't work. If I add the above css rule in PlatformPro Settings - Custom Code, then it works. The change takes place. Why is this? Is this a bug? I was hoping to make all my changes to the child theme's style.css. I thought the custom code section was there for the convenience of making quick changes. Please shed some light.

Share this post


Link to post
Share on other sites
ricardo

Hi Bera! No, it's not a bug, it has to do with load order. If you are adding overrides to existing rules in the Base css files, you need to add !important to them. I usually add new code to the base stylesheet and overrides to Custom CSS Rules. Ricardo

Share this post


Link to post
Share on other sites
klikwebdesign

Hi Ricardo, I don't get "you need to add !important to them." part. Also I didn't understand "I usually add new code to the base stylesheet and overrides to Custom CSS Rules." Isn't it the same? Don't you add your custom css rules to base stylesheet anyway?

Share this post


Link to post
Share on other sites
ricardo

Sorry! =) Lets say I declare the background color for the footer twice in 2 different files. The one that prevails is the one loaded last as it overrides or substitutes if you prefer the first instruction. But sometimes you need to make one particular rule be applied no matter which order they're loaded, and the way to do it is by adding !important to the value, like this: background-color: #66CCFF !important; This is only useful when you declare the same thing more than once, meaning, you can have 20 #footer rules but as long as no element repeats, like background-color for example, you don't need to use !important. As for the new code vs overrides, hopefully this will make more sense: - If I'm introducing new elements (layouts, image galleries, fancy text blocks, etc), I will add the CSS code to the base stylesheet; - If on the other hand I'm just using the existing elements but changing them to fit my needs, I add the CSS code to PlatformPro Settings > Custom Code > Custom CSS Rules only because that code will be loaded last and therefor take precedence over the existing code. Hope that makes more sense now =) Ricardo

Share this post


Link to post
Share on other sites
klikwebdesign

Great! Now I get everything. Cheers :) All this time and I didn't know about the !important ! Thank you much

Share this post


Link to post
Share on other sites
ricardo

You're welcome =) Ricardo

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

Sign in to follow this  

×