Ivory Search › Forums › Support › How to change the search box height to match menu items
- This topic has 9 replies, 2 voices, and was last updated 2 years, 5 months ago by Ivory Search.
You must be logged in to create new topic or reply to the topic. Click To Login
- AuthorPosts
- January 31, 2022 at 8:57 PM #10484
Good morning.
I’ve checked the FAQ https://ivorysearch.com/docs/use-custom-css-code/ and looked through previous requests in the forums here but can’t see reference to the CSS code snippet I’d need to be able to change the search box height to align more closely with that defined in my theme. You can see the height differs in the attached screenshot from https://salutethepig.com the box height needs increasing by a few pixels to align the bottom edge with the bottom edge of the menu boxes.
Can you assist? Thanks.
Attachments:
You must be logged in to view attached files. - January 31, 2022 at 9:04 PM #10543
I hope you are well today and thank you for your question.
You can achieve this by adding the below CSS code in the Custom CSS option of Ivory Search plugin settings on the path Admin Area -> Ivory Search -> Settings -> Settings
.is-menu .is-form-style input.is-search-submit, .is-menu .is-form-style input.is-search-input { height: 38px; }
Best regards,
Ivory Search Support - January 31, 2022 at 11:08 PM #10554
Thanks very much.
- February 2, 2022 at 8:31 PM #10581
You are always welcome, Iām glad I was able to help you with this matter. There is no obligation but by your kind words I wonder if I could trouble you to leave a review based on this experience here:
https://wordpress.org/support/plugin/add-search-to-menu/reviews/?filter=5
Iād really appreciate that. š
And if I can be of any further assistance please don’t hesitate to ask.
- May 27, 2022 at 9:34 PM #11923
Good afternoon.
I wonder if you can assist again? I’ve moved the Ivory Search into the Widgets section of my site and hope you can tell me what CSS code snippet I now need to increase the search box height by a factor of say 50% or 75% to more closely align with a box located beneath it?
I’ve added a screen shot to show where I’m hoping to effect this change.
Thanks very much
Chris
Attachments:
You must be logged in to view attached files. - May 30, 2022 at 8:53 PM #11950
Please use the below CSS code to achieve this.
.is-form-style button.is-search-submit, .is-form-style input.is-search-input, .is-form-style .is-search-icon { height: 38px; }
- May 31, 2022 at 9:08 PM #11951
Thanks for the swift reply. I changed the Custom CSS under Ivory Search/Settings to use that snippet instead and then cleared the Cloudflare cache but the Ivory Search box still looks smaller than the box below it (the screen shot below is from a desktop browser view). Am I missing something obvious here? Thanks.
Attachments:
You must be logged in to view attached files. - June 2, 2022 at 8:27 PM #11965
Please increase the height 38px in the above shared CSS code to suit your need.
- June 2, 2022 at 11:17 PM #11968
Thank you; my apologies for missing that completely obvious point š Appreciated as always
- June 4, 2022 at 10:53 PM #11973
Not an issue at all.
You are most welcome here š
- AuthorPosts
You must be logged in to create new topic or reply to the topic. Click To Login