This website uses cookies to personalize your experience. By using this website you agree to our cookie policy.

Reply To: Add to cart formatting glitch

#39333
Ernest MarcinkoErnest Marcinko
Keymaster

It works, thank you 🙂

Fortunately it is only a minor CSS specificity issue, the rules have to be adjusted. I already updated the knowledge base, please use this CSS from now:

div.asp_r.asp_w .asp_content a.add_to_cart_button,
div.asp_r.asp_w .asp_content a.added_to_cart {
    display: none;
    padding: 10px 15px !important;
    bottom: 5px;
    right: 5px; 
    z-index: 10000000;
    position: absolute;
    line-height: 13px;
}

div.asp_r.asp_w .asp_content a.added_to_cart {
    bottom: 5px;
    right: 126px; 
    background: white;
}

@media only screen 
  and (min-device-width: 320px) 
  and (max-device-width: 1024px) {
    div.asp_r.asp_w .asp_content a.add_to_cart_button {
        display: block !important;
    }
}

div.asp_r.asp_w .asp_content:hover a.add_to_cart_button,
div.asp_r.asp_w .asp_content:hover a.added_to_cart {
    display: block;
}

The isse was simply that the original rules were printed first, then the plugin styles, and since the specificity was equivalent, the latter overrides existing rules. These have more specificity, and will override the originals.