Return to previous page

Quantity Field for Mobile - by aahmadi3 - on WordPress WooCommerce support

This topic has 4 replies, 3 voices, and was last updated 8 years, 3 months ago ago by Robert Hall

  • Avatar: aahmadi3
    aahmadi3
    Participant
    January 13, 2016 at 19:07

    Hello,
    I would like to center the quantity field on mobile devices.
    Everything is currently centered except for that and it looks terrible.
    I have tried several different css codes but have not been able to fix it.
    Can you please help with this?
    Screen shot here: http://www.puredogfood.com/Print/screen_shot.jpg
    Thanks.
    Ali

    #107895 Copied Theme version: 2.9.2 WooCommerce version: 2.4.13
    3 Answers
    Avatar: Eva
    Eva Kemp
    Support staff
    January 13, 2016 at 19:40

    Hello,

    Please add this code in custom.css file:

    @media (max-width: 480px) {.single-product-page .product-info .quantity {
   margin-left: 40%;
}}

    Regards,
    Eva Kemp.

    #107905 Copied
    Avatar: aahmadi3
    aahmadi3
    Participant
    January 13, 2016 at 19:49

    That worked great Eva, how do I apply the same changes for tablets?
    Thanks.

    #107907 Copied
    Avatar: Robert Hall
    Robert Hall
    Support staff
    January 13, 2016 at 19:56

    Hello,

    Please use the following code in custom.css

    @media (max-width: 767px){
.single-product-page .product-info .quantity {
    left: 50%;
    margin-left: -32px;
}
}

    Regards,
    Robert Hall.

    #107908 Copied
  • Viewing 4 results - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.Log in/Sign up

Useful links WooCommerce & WordPress

Unleash your online potential

Explore our best WordPress WooCommerce Themes collection

lazy-placeholder
Artmaxy Store – WordPress WooCommerce Theme
lazy-placeholder
Hemp & CDB – WordPress WooCommerce Theme
lazy-placeholder
Books Store – WordPress WooCommerce Theme
lazy-placeholder
Jewellery Niche Market – Multivendor WP WooCommerce Theme
lazy-placeholder
Electronics Store – WordPress WooCommerce Theme
lazy-placeholder
Yoga Accessories – WordPress WooCommerce Theme
lazy-placeholder
Concert Store – WordPress WooCommerce Theme
lazy-placeholder
Electron Store 02 – WordPress WooCommerce Theme
lazy-placeholder
Minimal Electronics – WordPress WooCommerce Theme
lazy-placeholder
Plumbing Store – WordPress WooCommerce Theme

See All Templates

We're using our own and third-party cookies to improve your experience and our website. Keep on browsing to accept our cookie policy.