Hallo zusammen!
Ich würde gerne das Suchfeld meiner Website (http://www.jz-oz.de) überarbeiten und sie in eine modernere, ausfahrbarere Variante verwandeln - so wie hier http://codepen.io/llamaswill/pen/rmqfB oder auf vielen anderen aktuellen Seiten.
Momentan habe ich lediglich ein weißes Textfeld und ein kleines Lupen - Icon.
Hat jemand eine Idee, wie man die CSS umschreiben müsste?!
Code
.searchform {
-moz-border-radius: 15px;
-webkit-border-radius: 15px;
border-radius: 15px;
width: 160px;
padding: 0;
margin: 7px 5px 5px 10px;
height: 20px;
box-shadow:inset 0 0 1px #222;
background: #fff;
float: right;
margin-right: 20px;
}
.center .searchform {float:none;}
#morefoot .searchform {float:left;}
.searchform .s{
margin:0;
border: none;
margin: 3px 2px 2px 20px;
font-size: 12px;
height: 14px;
width: 130px;
color: #333;
overflow: hidden;
}
.phone-two .searchform {
width: 100%;
margin-right: 0;
}
#magnify {float:left;position:absolute;margin: 2px 0 0 5px;}
#magnify {margin: 0 0 0 5px/IE8+9; /* IE8+9 */}
.searchform .s:focus {outline:0; border:none;}
.searchform .searchsubmit {display:none;}
Alles anzeigen
Vielen Dank im Voraus für Eure Hilfe!
Herzliche Grüße
Chip