How to remove prices only on the collection page without affecting the entire site?

[Niki123]

I am trying to remove the pricing only on the collection page, but it keeps removing prices across the entire website. I am using the following code: 

<style>
html:has([href="/collections/all"]) .price {
display: none !important;
}
</style>

How do i go about only removing the prices on the collections, and not the products pages (catalogue page, https://myricobabyeurope.com/collections/all). Thanks!

[Liquid_xPert_SJ · Accepted solution]

@Niki123 

Please use below css code hopefully it will work for you.

#ProductGridContainer .card-information .price {
	display: none;
}

[Moeed]

Hey @Niki123 

Follow these Steps:

1) Go to Online Store
2) Edit Code
3) Find theme.liquid file
4) Add the following code in the bottom of the file above </body> tag.

{% if template contains 'collection' %}
<style>
.price {
    display: none !important;
}
</style>
{% endif %}

RESULT:

If I managed to help you then, don't forget to Like it and Mark it as Solution!

Best Regards,
Moeed