margin-left is -4px for search – hides start of search box

Home Forums Product Support Forums Ajax Search Pro for WordPress Support margin-left is -4px for search – hides start of search box

This topic contains 3 replies, has 2 voices, and was last updated by Ernest Marcinko Ernest Marcinko 4 years, 3 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #17791
    ajmccann
    ajmccann
    Participant

    After 4.12 update (maybe) my search boxes are suddenly skewed a few pixels left. See https://www.11trees.com/live/support/.

    Looking at the CSS I see:

    #ajaxsearchpro4_1 .probox .proinput input.orig, #ajaxsearchpro4_2 .probox .proinput input.orig, div.asp_m.asp_m_4 .probox .proinput input.orig {
    margin-top: -1px !important;
        margin-right: 0px !important;
        margin-bottom: 0px !important;
        margin-left: -4px !important;

    Why is there a -4? This seems to be introduced by Ajax Search, not my theme…but this is not my strong suit to debug:)

    #17798
    Ernest Marcinko
    Ernest Marcinko
    Keymaster

    Hi,

    That CSS is actually intented, and is correct, as on the parent element there should be a “0 0 0 10px” margin an “0 5px” padding. However these values are overwritten by higher specificity CSS rules from the frontend-builder-plugin-style.css file, which I’m guessing belongs to the font-end builder plugin.
    It resets some of the margins to and paddings to 0, and the text alignment on the icon containers. This custom CSS will resolve all of these problems:

    .proinput,
    .proinput * {
        box-sizing: content-box !important;
    }
    
    .proinput {
        margin: 0 0 0 10px !important;
        padding: 0 5px !important;
    }
    
    div.asp_m.ajaxsearchpro .probox .promagnifier .innericon,
    div.asp_m.ajaxsearchpro .probox .prosettings .innericon,
    div.asp_m.ajaxsearchpro .probox .proclose .innericon {
        text-align: center !important;
    }

    I guess I have to consider adding these rules to the higher compatibility CSS generator script for the upcoming release, to make sure they overwrite the default rules from that page builder.

    I hope this helps!

    Best,
    Ernest Marcinko

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


    #17806
    ajmccann
    ajmccann
    Participant

    Yes! Thank you…

    I use Divi, which has been updated quite a bit recently…

    #17808
    Ernest Marcinko
    Ernest Marcinko
    Keymaster
    You cannot access this content. Best,
    Ernest Marcinko

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


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

You must be logged in to reply to this topic.