Hi,
On mobile view, the product title, price, USPs (selling points), color options, and size options are currently center-aligned.
I’d like these elements to be left-aligned only on mobile, while keeping the desktop version as it is.
Could you please adjust the mobile CSS so that:
The title, price, selling points (USPs), color selector, and size selector are aligned to the left.
Desktop layout remains unchanged.
Thank you for your help!
Hi @NikvDaal ,
Welcome! Could you please share your store URL so I can provide an accurate solution?
Thank you
Add the CSS code below to the end of your theme.css file.
To find it, go to Online Store → Themes → click the three dots → Edit Code, and then search for theme.css.
Put this code
@media only screen and (max-width:768px){
.grid-product__content .grid-product__meta {
text-align: left;
}
}
i can only edit themse.css.liquid and not theme.css
Okay then you can put end of the css file 
it did not work it is still in the middle
Try this instead:
@media only screen and (max-width: 768px) {
.product-single__meta {
text-align: left;
}
.sales-point .icon-and-text {
justify-content: left;
}
}
You are looking for product page ?
Here is css for pdp just replace with this
@media only screen and (max-width: 768px) {
.product-single__meta {
text-align: left;
}
}
they both don’t work
If you’d like me to handle it, please share the collaborator code so I can edit the theme accordingly. Thank you
accepted the request
Its fixed. Please review it and let me know. Thanks
Perfect! thank you so much