How to target multiple search forms using custom css?

Ivory Search › Forums › Support › How to target multiple search forms using custom css?

Viewing 1 reply thread

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

  • Author
    Posts
    • October 6, 2022 at 3:07 AM #13329
      shaukatmalik995
      Participant
      • Topics: 1
      • Replies: 0

      Hello ivory family i have a question. I’ve installed ivory search form and its working perfectly and its amazing feature is AJAX search support.
      My question is how i can target 2 different search forms in css i mean i have 2 different search forms 1 for mobile and other for computers, laptops so i want search form to behave differently on mobile than laptops and computers like i want the search box height 30px for mobile and 40px for computer when i tried custom css it affects both forms. is there any way to find css ID/Class of different forms? I’m using following css.

      .is-form-style input.is-search-input {
      width: 100%;
      border-radius: 5px;
      height: 37px;
      font-family: arial;
      }

      Thanks

    • October 6, 2022 at 4:50 PM #13336
      Ivory Search
      Keymaster
      • Topics: 0
      • Replies: 1,735

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

      You can use search form IDs in the CSS selectors as below.

      .is-form-id-1895.is-form-style input.is-search-input {
}

.is-form-id-1796.is-form-style input.is-search-input {
}

      You can find your search form IDs on the below page.

      Admin Area -> Ivory Search -> Search Forms

      Best regards,
      Ivory Search Support

  • Author
    Posts
Viewing 1 reply thread

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