28172 sujets

CSS et mise en forme, CSS3

bonjour,

je cherche à aligner verticalement le texte de mon input "rechercher"
ca focntionne avec tous les navigateurs sauf IE8 Smiley biggol

voici mon code

• coté HTLM


<div id="search">
	<form method="get" id="searchform" action="<?php bloginfo('url'); ?>/">
		
			<input type="text" name="s" id="s"
						 value="<?php echo wp_specialchars($search_text, 1); ?>"
						 onFocus="clearInput('s', '<?php echo wp_specialchars($search_text, 1); ?>')" 
						 onBlur="clearInput('s', '<?php echo wp_specialchars($search_text, 1); ?>')"
			/>
			<input type="image" src="./wp-content/themes/blueprint/images/loupe.png" id="boutonloupe" />
		
	</form>
</div>


• coté CSS


#search #s 	{
	background: #EEEEEE;
	padding: 0 0 0 5px;
 	width: 190px;
 	color: #CCCCCC;
 	height: 32px;
 	vertical-align: middle;
 	font-size: 0.7em;
 	border:1px solid #D5D5D5;
}


merci pour votre aide Smiley cligne
Modifié par billboc (11 Oct 2010 - 19:02)
au fait, dans IE8 le texte est au TOP, et impossible de le placer en MIDDLE
alors que dans 3 autres navigateurs testés sous MAC & PC c'est parfait ???
Salut,

Généralement, j'évite de fixer une hauteur à un champ de formulaire (justement à cause des problèmes de centrage que cela occasionne).

Je te conseille de virer le height et de jouer du padding (haut / bas) pour obtenir une aération convenable (et symétrique).

Au passage le vertical-align n'a aucun effet dans ce cas de figure.