DishtyMatt Posted April 28, 2020 Share Posted April 28, 2020 Site URL: https://www.eatdishy.co.uk/recipes-main/roastedcauliflowerbiryani Hello, On my site the quantity box, as well as the variant drop down are very large. Is there a way they can be made smaller? Around half the size would be good? https://www.eatdishy.co.uk/recipes-main/roastedcauliflowerbiryani See example above. Any help or guidance would be great. Thanks in advance! Link to comment
tuanphan Posted April 29, 2020 Share Posted April 29, 2020 Add to Home > Design > custom CSS /* Variant */ .variant-select-wrapper { padding-top: 10px !important; padding-bottom: 10px !important; } /* Quantity */ .product-quantity-input input { padding-top: 10px !important; padding-bottom: 10px !important; } Luzian 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
Wood2626 Posted June 16, 2020 Share Posted June 16, 2020 On 4/29/2020 at 7:38 AM, tuanphan said: Add to Home > Design > custom CSS /* Variant */ .variant-select-wrapper { padding-top: 10px !important; padding-bottom: 10px !important; } /* Quantity */ .product-quantity-input input { padding-top: 10px !important; padding-bottom: 10px !important; } Hi, How would edit the width of these boxes as well ? Thanks Link to comment
mccallkeller Posted October 10, 2020 Share Posted October 10, 2020 (edited) Hey everyone! I would also be interested to know how to change the width of variant boxes, for example on my website here: https://www.andthenjewelry.com/collections/beni-shoga-n8amh I am trying to make the "Select Size' and "Quantity" fields the same width as the content above it. Edited October 10, 2020 by mccallkeller Link to comment
lynnnn Posted January 22, 2021 Share Posted January 22, 2021 .variant-select-wrapper { padding-top: 10px !important; padding-bottom: 10px !important; width: 70% } /* Quantity */ .product-quantity-input input { padding-top: 10px !important; padding-bottom: 10px !important; width: 35% } you can play around with the numbers of the width to see what works best tuanphan 1 Link to comment
tuanphan Posted January 24, 2021 Share Posted January 24, 2021 On 1/23/2021 at 4:20 AM, lynnnn said: .variant-select-wrapper { padding-top: 10px !important; padding-bottom: 10px !important; width: 70% } /* Quantity */ .product-quantity-input input { padding-top: 10px !important; padding-bottom: 10px !important; width: 35% } you can play around with the numbers of the width to see what works best I think you should set media query. unless the quantity/variant will be ugly on mobile gdmartino 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
rspkm Posted August 26, 2021 Share Posted August 26, 2021 On 1/24/2021 at 1:37 AM, tuanphan said: I think you should set media query. unless the quantity/variant will be ugly on mobile hi, on mine the custom css doesn't change both the padding and width, if i delete the 2nd input is change and vice versa with width Link to comment
gdmartino Posted January 26, 2022 Share Posted January 26, 2022 On 1/24/2021 at 12:37 PM, tuanphan said: I think you should set media query. unless the quantity/variant will be ugly on mobile Thank you! Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment