Can you post a link to your site? It’s really not possible to help with something like this without seeing the site live.
Search in the menu doesn’t even expand on click on my site, but this should work for the regular search.
#branding #s {
width: 196px;
}
I want to say that is a javascript function that may do that but without a link to your site like WPyogi stated we can’t be of much help. It could also be achieved with CSS3 animations and states…
Thread Starter
Fristi
(@fristi)
I am testing it local with XAMPP…
That’s why I uploaded the imgur files so you guys could see it.
Any suggestions?
It’s a css transition effect that does it. It can be countered by setting a width of the box.
Thread Starter
Fristi
(@fristi)
/* Search Form
----------------------------------------------- */
#branding #searchform {
position: absolute;
top: 30.5em;
right: 6.5%;
text-align: right;
}
#branding #searchform div {
margin: 0;
}
#branding #s {
float: right;
-webkit-transition-duration: 400ms;
-webkit-transition-property: width, background;
-webkit-transition-timing-function: ease;
-moz-transition-duration: 400ms;
-moz-transition-property: width, background;
-moz-transition-timing-function: ease;
-o-transition-duration: 400ms;
-o-transition-property: width, background;
-o-transition-timing-function: ease;
width: 75px;
}
#branding #s:focus {
background-color: #f9f9f9;
width: 180px;
}
#branding #searchsubmit {
display: none;
}
#branding .only-search #searchform {
top: 5px;
z-index: 1;
}
#branding .only-search #s {
background-color: #666;
border-color: #000;
color: #222;
}
#branding .only-search #s,
#branding .only-search #s:focus {
width: 85%;
}
#branding .only-search #s:focus {
background-color: #bbb;
}
#branding .with-image #searchform {
top: auto;
bottom: -27px;
max-width: 195px;
}
#branding .only-search + #access div {
padding-right: 205px;
}
This is my childtheme css code for the search box.
If I delete #branding #s, nothing happens because mothertheme got it..µ
How can I ‘delete’ it in my child theme?
Thanks in advance,
Fristi