WordPress.org

Ready to get started?Download WordPress

Forums

WooCommerce - excelling eCommerce
Aligning the button on the bottom (5 posts)

  1. MevrouwtjeVera
    Member
    Posted 1 year ago #

    How do I align the 'Add to card' buttons of my product page to the bottom of the row?

    Example:
    http://postimg.org/image/t4g0grkkt/

    The buttons "Add to Cart" have different vertical positions, depending on how long the title of the product is. I want the button to stick at the bottom, so it doesn't matter how long the title is, and each item is well aligned at the same line.

    Does anyone know how to deal with this problem? Help :)

    http://wordpress.org/extend/plugins/woocommerce/

  2. IgniteWoo
    Member
    Posted 1 year ago #

    Add a fixed height the div wrapper, and position the button at the bottom of the div using css "position" and "bottom" definitions.

  3. sunhawk
    Member
    Posted 11 months ago #

    Can you explain your answer more specifically regarding where in the CSS and what code you need to add?

  4. sunhawk
    Member
    Posted 11 months ago #

    I figured it out, this is what I added (probably some redundancy in the css, I repeated myself just to be sure lol):

    .woocommerce.product-columns-5 ul.products li.product, .woocommerce-page.product-columns-5 ul.products li.product {
    width: 16.9%;
    height: 250px!important;
    vertical-align: bottom!important;
    bottom: 0!important;
    }

    .woocommerce ul.products li.product a, .woocommerce-page ul.products li.product a {
    text-decoration: none;
    bottom: 0!important;
    vertical-align: bottom!important;
    position: absolute!important;
    }

  5. lockhartg
    Member
    Posted 8 months ago #

    Would love some help with this for http://www.css-signs.ie/shop/

    If the text goes to 2nd line it just looks awful!!!

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic