Ivory Search › Forums › Support › Search button position
Tagged: Button Position
- This topic has 2 replies, 3 voices, and was last updated 1 year, 3 months ago by Yerko Browton.
You must be logged in to create new topic or reply to the topic. Click To Login
- AuthorPosts
- February 14, 2022 at 11:39 PM #10707
Hi, one of you know how to change Search Button Position?
Im looking for make a search bar that it look same as the index file I share. I have managed to put the same styles, but the search button is out of position :/, thanks.
Custom CSS: The search bar i have, put it in your default search bar 4 try 🙂
http://democasur.sasoftco.com : The search bar i wish
My custom CSS in Ivory wordpress plugin:
————————————————————
.is-form-style.is-form-style-3 input.is-search-input {
position: relative;
z-index: 3;
width: 100%;
height: 42px!important;
background: #fff;
font-family: Work Sans, sans-serif;
letter-spacing: 0;
color: #4b4b4b;
padding-left: 1.2rem;
padding-right: 45px;
border-radius: 8px;
background-size: 35px 35px;
}.is-form-style input.is-search-input {
margin: 0;
outline: 0!important;
font-size: 16px!important;
min-height: 0;
line-height: 1;
border: solid 1px #bbb!important;
box-sizing: border-box;
outline: none;
padding: 1px 2px;
}.is-form-id-179 .is-search-submit:hover{
color: #ffffff !important;
background-color: #ffffff!important;
}.is-form-id-179 .is-search-icon {
color: #ffffff !important;
background-color: #3366cc!important;
}.is-form-id-179 .is-search-submit {
color: #ffffff !important;
background-color: #ffffff!important;
}.is-form-style input.is-search-submit, .is-search-icon {
display: block!important;
position: absolute;
top: 1px;
right: -1px;
z-index: 4;
color: #666;
background: #ededed;
box-shadow: none!important;
outline: 0;
margin: 0;
font-size: 14px!important;
border: 1px solid #ccc;
border-radius: 50%;
line-height: 1;
height: 36px;
text-transform: capitalize;
vertical-align: middle;
-webkit-transition: background-color .1s ease-in-out;
-moz-transition: background-color .1s ease-in-out;
-o-transition: background-color .1s ease-in-out;
transition: background-color .1s ease-in-out;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}.is-search-icon {
width: 36px;
padding-top: 6px!important;
}.is-form-style button.is-search-submit {
background: 0 0;
border: 0;
box-shadow: none!important;
opacity: 1;
padding: 0!important;
margin: 0;
line-height: 0;
outline: none;
vertical-align: middle;
width: 36px;
height: 36px;
}
————————————————————Thanks you all, im rookie but im happy to be here, greetigs!
- February 15, 2022 at 12:15 PM #10708
I hope you are well today and thank you for your question.
I am not sure I understood your question properly so could you please describe it a bit more?
Also, I don’t see search bar on your shared website displayed by the Ivory Search plugin.
Best regards,
Ivory Search Support - August 4, 2023 at 10:11 PM #17183
Bro me salvaste, no encontraba las clases. al final lo deje asÃ:
.is-form-style.is-form-style-3 input.is-search-input {
border-radius: 40px 0 0 40px;
}.is-form-style input.is-search-input {
text-align: center;
font-size: 14px!important;
font-weight: 600;
border: solid 0px #bbb!important;
}.is-form-style input.is-search-submit, .is-search-icon {
border-radius: 0 40px 40px 0;
border: solid 0px;
}Saludos!
Attachments:
You must be logged in to view attached files.
- AuthorPosts
You must be logged in to create new topic or reply to the topic. Click To Login