Problems with getting the columns aligned in different viewports.

Home Forums Product Support Forums Ajax Search Pro for WordPress Support Problems with getting the columns aligned in different viewports.

This topic contains 3 replies, has 2 voices, and was last updated by Ernest Marcinko Ernest Marcinko 1 year, 10 months ago.

Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #29503
    Kaalund
    Kaalund
    Participant

    We are already using the Ajax Search Pro plugin and have set it up, but no matter what we do (we have searched the knowledge base as well) we cant seem to center the widget on mobile and tablet. We have used CSS .asp_sb_1 {margin: 0 auto !important;
    } in the custom CSS tab in the plugin, but it doesn’t help. This is an issue, we have been trying to solve for a long time now. Any idea what we can do? I have some pictures of the showing on tablet and mobile, please see attached.
    Any help will be greatly appriciated.

    Attachments:
    You must be logged in to view attached files.
    #29507
    Ernest Marcinko
    Ernest Marcinko
    Keymaster

    Hi!

    Thank you for the details! I tried to log-in to the back-end to check the settings, but the admin login does not seem to work with these details.

    I probably don’t need them anyway. For the settings items to center, try using this custom CSS:

    div.asp_sb.asp_sb_1.searchsettings form {
        justify-content: center;
    }

    Because the search is in a custom shortcode via the shortcode builder, and I see a 75% ratio, it cannot center itself, as the container is smaller than the rest. Try centering the container itself with this custom CSS:

    .asp_shortcodes_container {
        justify-content: center;
    }

    These two custom CSS codes will result in this layout: https://i.imgur.com/Zjj6T3K.png

    Best,
    Ernest Marcinko

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


    #29627
    Kaalund
    Kaalund
    Participant

    Hello Ernest, thanks for the reply. I changed the 75% ratio to 100% and it looks good on desktop. I get the layout you sent a picture of, how ever the searchfilters still don’t align under the search field, they are a bit to the left and exceed the space of the searchbar, any way to change this?

    #29628
    Ernest Marcinko
    Ernest Marcinko
    Keymaster

    Hi,

    It is perferctly centered, if you check this screenshot: https://i.imgur.com/g2jeFEZ.png
    The containers including the filters are wider as the text itself, namely set to 150px width in your case, which looks perfectly fine, as it almost reaches the edge of the longest text line (Lateral Thinking).
    You could force a right aligned text for the labels to fit the whole filter area, but it would not look great in my opinion: https://i.imgur.com/dElBMb2.png

    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.