Support » Plugin: Ivory Search - WordPress Search Plugin » How to make the search box align with the site width?

  • Resolved pro99

    (@pro99)


    Hi, we’re testing the Yvory search box and would like to have it align with the theme’s borders left and right. Is there a setting or some CSS to accomplish this? Ideally the plugin would do this out of the box given that CSS changes tend to require frequent maintenance when new child themes are loaded. Thanks!

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

Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Author Vinod Dalvi

    (@vinod-dalvi)

    I hope you are well today and thank you for your question.

    I visited your shared site and saw multiple search forms on it so could you please tell me exactly which search form you want to display full width?

    Best regards,

    Hi Vinod, it looks like I had residual server cache showing also the previous form inside the menu. You should no longer see it and only see the Ivory box underneath the site logo.

    Best,
    Nick

    Plugin Author Vinod Dalvi

    (@vinod-dalvi)

    Yes now I can see it.

    You can align it by adding the below CSS code in the Custom CSS option of Ivory Search plugin settings on the path Ivory Search -> Settings -> Settings

    .site-container > form.search-form {
        max-width: 1065px;
        margin: 0 auto;
    }

    Vinod, thanks! It worked with resizing, while creating a grey horizontal bar above the search box and a black line below, when clicking inside the box. Any guidance on avoiding these?

    Plugin Author Vinod Dalvi

    (@vinod-dalvi)

    Please try using below custom CSS code to remove that black line.

    body .search-form input:focus,
    body .search-form input:hover {
        border: 0;
    }

    Thank you!

    Plugin Author Vinod Dalvi

    (@vinod-dalvi)

    You are most welcome here 🙂

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘How to make the search box align with the site width?’ is closed to new replies.