Welcome, Guest
Username: Password: Remember me
Use this Category for your support questions about Virtuemart Template - CleanMart (SKU# FLEX-00015)

TOPIC: Yootheme custom.css overiding my flexible.css

Yootheme custom.css overiding my flexible.css 8 years 4 months ago #13532

Hi flexible team
I would need to add .css only for cleanmart theme but as i used .tmcontent that is the same than yootheme avenue there is a conflict and the yootheme css is overrinding the cleanmart flexible.css

How can i set up the cleanmart in order flexible.css or other custom.css will override the yootheme template?

thank you
The administrator has disabled public write access.

Yootheme custom.css overiding my flexible.css 8 years 4 months ago #13544

hi,

I didn't quite understand what you meant.. but; sometimes joomla templates use specific CSS rules to avoid being override by 3rd party extensions. Maybe this is the case. In those cases, the order of the CSS files on the page doesn't matter.
div.classDummy { color:red;}
or
#main .classDummey { color:red;}

always override this:
.classDummey { color:red;}

regardless of which ever rule is called first or last. Because they are more specific rules.

but this rule on the other hand:
.classDummey { color:red !important;}

will override them all , because it has the !important parameter (Using too many !important is not very ideal unless you know what you are doing)

But the weird thing is, how come YooTheme templates override CleanMart? They don't style the same elements at all.. (maybe couple elements, i.e: "add-to-cart input button" element. In those rare cases you can use !important parameter in the flexible.css)

Another method (the more professional method) is to load a completely new CSS file in the last order (just before </head> tag) and put your custom CSS rules (the most specific CSS rules without using !imporrant) in it to override everything (override the rules of both flexible.css and yootheme's CSS's all together)

To load a brand new custom CSS file, open the joomla template's index file. For yootheme templates it is right here: /templates/YOUR_TEMPLATE/layouts/template.php

find the </head> tag and just before it, inject this line:
<link rel="stylesheet" href="/templates/YOUR_TEMPLATE/css/custom2.css" type="text/css" />

then create that custom2.css file in this path: /templates/YOUR_TEMPLATE/css/ and put your new custom CSS rules in it.

regards
Last Edit: 8 years 4 months ago by Support.
The administrator has disabled public write access.
Time to create page: 0.528 seconds

MaterialMart

for Virtuemart 3

Google's Material Design has finally arrived to Virtuemart

Virtumart Template - MaterialMart Virtumart Template - CleanMart Virtumart Template - CleanMart Virtumart Template - CleanMart

Fully responsive!

Buy Now   |   Live Demo