Shopify themes, liquid, logos, and UX
Hello
I need help moving product price above product photos. I need this for mobile view and for product pages.
My url is designsfordivine.com
I appreciate any help
Thanks very much
Solved! Go to the solution
This is an accepted solution.
Hi @omero
I notice that you used the code that I give on your previous post. But you change the top size which will have a problem on the ipad scree or bigger screen on the phone.
As you notice I give another top size on different size screen for the more lesser screen size. But anyway im just giving a friendly comment.
Try this for price. I used 749px because that is the beginning size of the mobile/ipad sizes.
@media only screen and (max-width: 749px) {
div#price-template--19358373314887__main {
position: absolute;
top: 40%;
}
}
@media only screen and (max-width: 460px) {
div#price-template--19358373314887__main {
top: 35%;
}
}
I hope it help.
Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
@omero - this will need bit code editing, are you familiar with the coding?
This is an accepted solution.
Hi @omero
I notice that you used the code that I give on your previous post. But you change the top size which will have a problem on the ipad scree or bigger screen on the phone.
As you notice I give another top size on different size screen for the more lesser screen size. But anyway im just giving a friendly comment.
Try this for price. I used 749px because that is the beginning size of the mobile/ipad sizes.
@media only screen and (max-width: 749px) {
div#price-template--19358373314887__main {
position: absolute;
top: 40%;
}
}
@media only screen and (max-width: 460px) {
div#price-template--19358373314887__main {
top: 35%;
}
}
I hope it help.
Please don't forget to Like and Mark Solution to the post that helped you. Thanks!
Hello, thanks for clarifying your last solution. I appreciate your new solution as well. I make few changes to them because they are partly working, the positions didn't work for my phone
So I use iphone 13 pro myself, and when I use your exact css, the title is on top of product image. This is the same case for the price as well.
I understand there are screen sizes for mobile devices. I need to make it look proper for all mobile device types. I appreciate your answer, I just tried to adjust it so it doesn't overlap with other content (I am beginner on css)
Thanks very much
Your welcome, I just notice it. That is really the hard part the screen sizes.
We recently spoke with Zopi developers @Zopi about how dropshipping businesses can enha...
By JasonH Oct 23, 2024A big shout out to all of the merchants who participated in our AMA with 2H Media: Holi...
By Jacqui Oct 21, 2024We want to take a moment to celebrate the incredible ways you all engage with the Shopi...
By JasonH Oct 15, 2024