Yugvir 0 Share Posted August 13 (edited) Site URL: https://www.themaycircle.com/shop/p/atmanirbhar Im having problems changing the order of the stack of ProductItems when in mobile resolution. I need to have the following order (from top to bottom) : Product title> Gallery > Description > Variant selector > Add to cart button. I tried to make a custom flexbox but to no avail. Id appreciate the help. Thanks! Edited August 20 by Yugvir Link to post
0 Yugvir 0 Author Share Posted August 13 (edited) I managed to get results with the following, which works for me, but the title still wont come at top. @media screen and (max-width:640px) { section.ProductItem-summary.clear { display: flex; flex-direction: column; } figure.ProductItem-gallery { order: 0; } .collection-type-products .ProductItem-details .ProductItem-details-excerpt { order: 2; } .collection-type-products .ProductItem-details h1.ProductItem-details-title{order:1;} } Ive put order 1 in title here because putting it down as 0 doesnt work. And even starting the order from 1 among these doesnt work either sigh hope this may help someone Edited August 13 by Yugvir Link to post
Question
Yugvir 0
Site URL: https://www.themaycircle.com/shop/p/atmanirbhar
Im having problems changing the order of the stack of ProductItems when in mobile resolution. I need to have the following order (from top to bottom) :
Product title> Gallery > Description > Variant selector > Add to cart button.
I tried to make a custom flexbox but to no avail. Id appreciate the help. Thanks!
Edited by YugvirLink to post
Top Posters For This Question
2
Popular Days
Aug 13
2
Top Posters For This Question
Yugvir 2 posts
Popular Days
Aug 13 2020
2 posts
1 answer to this question
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment