Edwardxu

Hi Paul,
Are there any multi-currencies solutions for Squarespace 7.1 website?

you used
adding !important after 10px, the code should be
font-size: 10px !important;  

We can't target second line. However we can change both first + second line. Then use another code to change first line, thus, both will have different style.
Add to Design > Custom CSS
/* Second Line + First Line */ h1.ProductItem-details-title { font-family: proxima-nova !important; font-weight: 300 !important; font-style: normal; letter-spacing: 0em; text-transform: none; line-height: 1.8em !important; } /* first line */ h1.ProductItem-details-title:first-line { font-family: Philosopher; font-weight: 700; font-style: normal; letter-spacing: .09em; text-transform: none; line-height: .9em; }  

Site URL: https://www.edxulondon.com/shop
Hi All, I used custom CSS code to make the product title on shop page to split into 2 lines and in 2 different font style and size (by adding "|' between the 1st and 2nd lines, example: 'TEARS EMERALD RING | Gold Vermeil & Rhodium Plated Silver'). On the desktop version it shows perfectly. But on the mobile version, because I am using 2 items per row, there aren't enough space for the 1st line, so some of the words before '|' and should be in 1st line's font and size falls into the second line and follow the 2nd line' font and size. How can I change this and make everything following the desktop version on mobile?
Thank you so much in advance for any advice and help!
 

Add to Design > Custom CSS
/* Show price */ .tweak-products-price-hide .products.collection-content-wrapper .grid-prices { display: block !important; }  

Hi Paul, I actually amended the css code and sorted everything. Thanks again for your article and help, it was really helpful!

Looks like you may have solved this now? I'm seeing two styles.