28172 sujets

CSS et mise en forme, CSS3

Espace input texte

Bonjour,

pourquoi dans IE 7,8 j'ai un décalage d'1px au dessus et en dessous de mon input?

j'utilise un reset et voici le code


<form id="search_form" action="">
<p><input type="text" name="search" id="search" value="Recherchez" /></p>
</form>




form#search_form {
	padding: 0 0 0 0;
	width: 273px;
	height: 38px;
	float: left;
	position: relative;
	background: cyan;
}


input#search {
	border: none;
	color: #999999;
	font-size: 1px;
	width: 145px;
	height: 25px;
	padding: 0 0 0 0;
	border: none;
	display: block;
}


Merci
Modifié par gforce (08 Jul 2011 - 11:38)
tu peux essayer un truc comme ça ... T'as plein de façon différentes d'arriver à tes fins...

<form id="search_form" action="">
<div><input type="text" name="search" id="search" value="Recherchez" /></div>
</form>


input#search {
border: none;
color: #999999;
font-size: 1px;
width: 145px;
height: 25px;
padding: 0 0 0 0;
border: none;
display: block;
border:1px solid black;
margin-top:12px;

}
gforce a écrit :
c'est quoi cette réponse Smiley eek

Une invitation à t'assurer que tes pages ont un Doctype en bonne et due forme.
En l'absence de Doctype les navigateurs affichent la page en «mode Quirks», c'est-à-dire en essayant d'imiter des comportements non standard courants dans les navigateurs de la fin des années 1990. Avec un Doctype en bonne et due forme, le navigateur fait de son mieux pour respecter différents standards.
Je me doute bien qu'il faut un doctype... J'ai simplement mis la portion de code qui pose problème.
Bonsoir à toutes et à tous,

j'ai repris ton code ci-dessus et je l'ai testé sans DOCTYPE. L'erreur que tu as signalé s'est bien produite. Maintenant avec un DOCTYPE l'erreur ne se produit plus du tout.

Conclusion : dans la mesure où tu nous a donné très peu d'information sur le pourquoi et le comment de cette anomalie, nous avons fait avec les moyens de bords.
<!doctype html>
<html>
<head>
<title>test</title>
<style type="text/css">
form#search_form { 
    padding			: 0;
    width			: 273px; 
    height			: 38px; 
    float			: left; 
    position		: relative; 
    background		: cyan; 
} 

input#search { 
	border			: none; 
	color			: #999999; 
	font-size		: 16px; 
    width			: 145px; 
    height			: 25px; 
    padding			: 0; 
    border			: none; 
    display			: block; 
} 
</style>
</head>

<body>
<form id="search_form" action="">
	<p><input type="text" name="search" id="search" value="Recherchez" /></p>
</form> 
</body>
</html>


@+
Ok, c'est très étrange comme ma page est valide en xhtml 1 strict. Je refaire d'autres test, merci !
Sujet clos
Aller à