-
Posts
-
Hello,
I would like to make a lot of custom css changes to the display of woo commerce in enfold site. I see most of your questions/answers here are specific to one single item and are very specific to that item. I don’t want to waste time with questions for every single need, so is it possible to answer these and I can then do all the specific changes myself in my child theme css?1. How do you specify that the css selector (eg .price, .product h3, .button.add_to_cart_button, a.cart_item, td.product-name ) for some text or a button or a table background or whatever, only applies to the current page (eg cart page or catalog page or error page etc) rather than throughout all the pages. I can easily identify the correct selector with firebug or developer tools in browser, but sometimes for example I want the .price to display different sizes in different contexts or pages, or make same css style tables look different on different pages but their css selector is obviously in common use on all pages (ie price displays same font/size on all pages).
2. When should one use “important!” at the end of the style definition? I see that here often in your replies.
Thank you
Hi patricknh!
1. Look at the body tag in the firebug display and you’ll see a bunch of classes assigned to it. These classes are different for each page. If it’s a Woocommerce related page for example then there should be a “woocommerce” or product archive class assigned to it which you can use.
2. Basically whenever your CSS is not getting applied you can use !important to make sure it gets applied. You can try and get more specific in your CSS declarations such as adding #top to the front of it and moving down the tree.
#top #main .entry-content p { font-size: 12px; }But if it still does not get applied then use !important.
Thanks for trying to learn. We get lots of customers who just post what they want done and do not bother to learn how to do it. CSS is simple!
Cheers!
Elliott
- You must be logged in to reply to this topic.