I need some help with this.
I need to move the title on the product page above the image for the mobile view. dawn theme.
Topic summary
A user needs to reposition the product title above the image on mobile devices in the Dawn theme.
Proposed Solution:
A CSS code snippet was provided to add to the base.css file, targeting screens under 429px width. The code adjusts:
- Grid item padding
- Product title font size and margins
Current Status:
The solution did not work as intended—the title disappeared after implementing the code. The issue remains unresolved, with another user asking how the problem was eventually solved, suggesting the thread may have continued elsewhere or the original poster found an alternative fix.
Hello @Vladut ,
In Shopify Admin, navigate to “Edit theme code”, then open the “base.css” file and add the following code at the end:
@media screen and (max-width: 429px){
.grid--peek.slider .grid__item:first-of-type {
padding-top: 54px !important;
}
.product__title{
margin-top: -74vh !important;
margin-bottom: 62vh !important;
}
.product__title h1{
font-size: 26px !important;
}
}
If I managed to help you then, don’t forget to Like it and Mark it as Solution!
It seems this is not working.
The title disappeared after adding the code in the base.css
How did you get it done?