I can’t customize css product variations

  • Resolved frajola

    (@frajola)


    2 years, 9 months ago

    Hi guys. I’m trying to style the “Custom Add To Cart” widget using Elementor PRO, but I’m not able to make any changes. I can’t remove the background of the variations selectors, hover background, change the position title text and change the color of the “Add To Cart” button when it is locked. I would like to leave the locked button gray (#808080).
    Can anybody help me ?

    I am only able to change the border of the selector bar and the font and color of the texts.

    I made the changes in photoshop so you can understand.
    View example image.
    I’m good at photoshop, but not CSS. sorry.

    I’m using the Hello Elementor theme.

    • This topic was modified 2 years, 9 months ago by frajola.

    The page I need help with: [log in to see the link]

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

  • It is difficult to help without visiting your product page.

    Can you please share your product page link to check?

    Thread Starter frajola

    (@frajola)

    My website/store is hosted on localhost, but I was able to make it public today on paid hosting.

    example image page:
    https://telzin2k.tk/produto/camiseta-tommy-hilfiger-slim-fit/

    You can place the below CSS at Appearance > Customize > Additional CSS

    table tbody tr:hover>td, table tbody tr:hover>th {
    background-color: transparent;
}

table tbody>tr:nth-child(odd)>td, table tbody>tr:nth-child(odd)>th {
    background-color: transparent;
}

.woocommerce div.product form.cart .variations th {
    display: block;
    text-align: left;
}

    Then let me know if it resolves your issue or not.

Viewing 3 replies - 1 through 3 (of 3 total)
  • The topic ‘I can’t customize css product variations’ is closed to new replies.