Search button text cut off – search bar too wide – search button too narrow

Ivory Search › Forums › Support › Search button text cut off – search bar too wide – search button too narrow

Tagged: , ,

Viewing 2 reply threads

You must be logged in to create new topic or reply to the topic.

  • Author
    Posts
    • August 19, 2018 at 8:11 AM #578
      brochite
      Participant
      • Topics: 1
      • Replies: 1

      In all tested sizes, from mobile to full screen, my theme seems to be too narrow for the width of the default search bar. Is there any way to style it so that the text in the search button always shows. In other words, the entry bar needs to be narrower, and the button needs to be wider.

      Example: brochite.com/search-all-posts

      Thanks!

      Attachments:
      You must be logged in to view attached files.
    • August 19, 2018 at 9:33 AM #580
      Ivory Search
      Keymaster
      • Topics: 0
      • Replies: 1,744

      Hi Brochite,

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

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

      
#page  .ivory-search #searchsubmit {
    width: 100px;
}

#page .ivory-search input.search-field {
    width: calc(100% - 100px);
}

      Best regards,
      Ivory Search Support

      • August 19, 2018 at 9:47 AM #581
        brochite
        Participant
        • Topics: 1
        • Replies: 1

        This works beautifully! Thanks for the code; I didn’t have a clue how to style the object without your help!

    • August 19, 2018 at 9:59 AM #582
      Ivory Search
      Keymaster
      • Topics: 0
      • Replies: 1,744

      You are most welcome here 🙂

      Thank you for your valuable feedback and review 🙂

      Please advise if you have more questions.

      Have a fantastic day!

  • Author
    Posts
Viewing 2 reply threads

You must be logged in to create new topic or reply to the topic.