Add to cart formatting glitch

Home Forums Product Support Forums Ajax Search Pro for WordPress Support Add to cart formatting glitch

This topic contains 4 replies, has 2 voices, and was last updated by Preet Preet 5 days, 15 hours ago.

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #39329
    Preet
    Preet
    Participant

    Hi there,

    I reproduced this in our dev server, which is greatly simplified compared with our production site. The issue happens with both. And reverts to normal with 4.22.5.

    The php is in the snippets plugin, and the CSS is in the child theme customisation section.

    Many thanks,
    Christopher

    • This topic was modified 5 days, 15 hours ago by Preet Preet.
    #39331
    Ernest Marcinko
    Ernest Marcinko
    Keymaster

    Hi Christopher,

    Thank you! Unfortunately I am getting an access denied message on the dev site (even on the front page): https://i.imgur.com/BwaLiJX.png
    Can you please check that?

    Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


    #39332
    Preet
    Preet
    Participant

    Hi Ernest, that was a Clouldflare issue
    https://www.makeuseof.com/cloudflare-error-1020-access-denied-fix/
    I have whitelisted Slovakia to access wp-admin, so hopefully that will be OK now.

    #39333
    Ernest Marcinko
    Ernest 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.

    Best,
    Ernest Marcinko

    If you like my products, don't forget to rate them on codecanyon :)


    #39335
    Preet
    Preet
    Participant

    Super, thank you!

Viewing 5 posts - 1 through 5 (of 5 total)

You must be logged in to reply to this topic.