Add to cart button alignment on mobile device

  • Resolved carpaccio

    (@carpaccio)


    9 years, 11 months ago

    Hello,

    we made a WordPress site with the Divi theme. With the css code
    .woocommerce ul.products li.product, .woocommerce-page ul.products li.product {min-height: 440px !important; margin-bottom:10px; }
    ul.products li.product a.button {position: absolute !important; bottom: 100px; }
    we have aligned the add to cart button on the same height.

    On mobile device’s is the button now to high, how can we change it?

    Thanks in advance!

    with kind regards

Viewing 4 replies - 1 through 4 (of 4 total)
  • con

    (@conschneider)

    Engineer

    9 years, 11 months ago

    Hi there,

    I find this best for applying CSS to mobile view only. https://wordpress.org/plugins/responsive-css-editor/

    Thread Starter carpaccio

    (@carpaccio)

    9 years, 11 months ago

    Thanks,
    i don’t know what kind of code i must be use.
    the css code what we have used works only on desktop screens.

    With kind regards

    ThemeSumo

    (@themesumo)

    9 years, 11 months ago

    The simplest way of adding custom CSS code to your theme is to use this Custom CSS plugin, just install & activate it and add your CSS code via the Appearance > Custom CSS menu.

    You can use Media Queries to apply different CSS at differing viewport widths, like so:

    @media screen and (max-width: 900px) {
    /* css code here */
}

    This will only apply the CSS code you add if the viewport is less than 900px wide.

    Hope this helps.

    Thread Starter carpaccio

    (@carpaccio)

    9 years, 11 months ago

    Thanks for your help! we have made the changes on our website.

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Add to cart button alignment on mobile device’ is closed to new replies.