How can I use CSS to target a specific product collection?

[johnwg]

I have some products that are "customizable" and not to be added to the cart in shopify (you select to customize these products by going to a third party app and submitting a request, so the ordering isnt handled by shopify). I have them in their own collection(s). One example of the collection name is "Custom Shirts". For the actual product pages, I created a copy of the template and used CSS to remove the pricing and add to cart button, and applied this template to each product that is customizable.  However, i want to remove the price on the collections main list of products. I need to be able to target the "custom shirts" collection and display: none the prices. How can you target a particular collection in css?               

[johnwg]

I should add that i did searches both here and on google but did not find a resolution.

[p1Commerce]

This should do the trick.  You'll want to make sure that "Custom Shirts" is the exact name of your collection and that the CSS is correct for your theme (code provided is for default Dawn):

{% if collection.title == "Custom Shirts" %}<style type="text/css">.grid__item .price { display: none; }</style>{% endif %}

This would however break if you, or someone in your admin, were to rename the collection, so I'd recommend instead using the code below and replacing 999999 with your collections numeric id which you can get from the URL bar when editing a collection in your admin. 

{% if collection.id == 999999 %}<style type="text/css">.grid__item .price { display: none; }</style>{% endif %}

[johnwg]

Thank you so much for the answers! I got tied up a bit but will try these and let everyone know how i make out!

[Giancarlo1991]

I am also interested in this topic. Where does this code needs to be added?

[D666]

I found a solution.

https://stackoverflow.com/questions/36512354/shopify-styling