[CSS][HTML]Centrowanie inputa Opcje

[zomfire]

Witam, mam nastepujący problem, mój input z wyszukiwaniem nie chce się centrować w pionie:
HTML:

[HTML] pobierz, plaintext 
<div class="panel_nawigacyjny">
    <div class="pn_kontener">
		<div class="pn_lewo">
			<div class="pn_text">Kategorie</div><a class="button3"></a>
        </div>
		<div class="pn_prawo">
			<div class="pn_text">Wyszukaj:<input type="text" value="Szukaj..." class="pn_wyszukiwarka" autofocus="autofocus" onclick=""></input></div><a class="button4"></a>
        </div>
    </div>
</div>
[HTML] pobierz, plaintext 

CSS:

[HTML] pobierz, plaintext 
.panel_nawigacyjny{
width:100%;
background-color:#313131;
min-height:30px;
border-radius:6px;
box-shadow: 3px 3px 6px 0px rgba(0, 0, 0, 0.3);
}
.pn_kontener{
width:80%;
margin:0px auto;
}
.pn_lewo{
float:left;
display:inline-block;
 }
.pn_prawo{
float:right;
display:inline-block;
}
input[type="text"] {
line-height:30px;
border-radius:3px;			 
}
.pn_text{
line-height:30px;
text-align: center;
font-size:18px;
color:#B0AFAE;
}
[HTML] pobierz, plaintext 

Tekst po lewej jest w na środku, natomiast input na górze.

[trueblue]

Usuń line-height dla input.

[zomfire]

To nic nie zmienia.

[Daimos]

[CSS] pobierz, plaintext 
div.pn_text{
    display: table-cell;
    vertical-align: middle;
}
[CSS] pobierz, plaintext 

zamykaj input tak:

[HTML] pobierz, plaintext 
<input type="text"/>
[HTML] pobierz, plaintext 

[zomfire]

Teraz to wygląda tak: http://ifotos.pl/zobacz/errorpng_wraxrqs.png
Czyli input jest u góry, a ikonki sa pozamieniane i jedna przeszła do drugiej linii.
Mi zależy na tym by wyglądało tak jak na projekcie: http://ifotos.pl/z/wraxrqa/
I by te elementy w kontenerze były wyśrodkowane w pionie.

Ten post edytował zomfire 17.01.2015, 21:20:08