28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous Smiley smile

Bon voilà je planche actuellement sur une refonte totale d'un de mes sites web. J'ai décidé de passer aux standarts et j'ai quasiment tout fini de coder en XHTML Strict 1.0. Mais là je tombe sur un petit os...

Dans mon design, aux alentours du header, j'ai une balise <form></form> pour un champs "rechercher". Jusque là pas de soucis. Le seul hic c'est que cette balise form provoque un saut de ligne Smiley decu

Par exemple:

<div id="recherche">Rechercher:<form action="" method="post">
		<input type="text" class="textfield" size="38" />
		<input name="Envoyer" type="submit" class="submit" value="Ok" />
		</form>
		</div>


Cependant, si je mets le texte "Rechercher à l'intérieur du form

		<div id="recherche"><form action="" method="post">Rechercher:
		<input type="text" class="textfield" size="38" />
		<input name="Envoyer" type="submit" class="submit" value="Ok" />
		</form>
		</div>


J'ai pas de saut de igne, mais j'ai droit à autre chose... une page XHTML non valide Smiley murf

Quelqu'un aurait une astuce?

PS: le champs "id" recherche est en float: left;

Merci de votre aide Smiley lol
Modifié par John Doe (29 Jun 2006 - 09:34)
Administrateur
Hello et bienvenue Smiley cligne

L'élément <form>, comme toutes les balises de type bloc sauf <div>, possède des marges par défaut (margin, padding). D'où les espaces avant et après la balise.

Il suffit de supprimer ces marges pour qu'il n'y ait plus d'espaces.

Par exemple ainsi :
form {
margin: 0;
padding: 0;
}


Tu as une méthodologie complète ici pour ce qui concerne les problèmes d'affichages en CSS.

La raison pour que ton code ne valide pas est tout autre : l'élément <form> est particulier dans le sens où <form> ne peut être parent direct que d'éléments de type bloc.
En clair :
- <form> ne peut pas contenir directement des balises en-ligne comme <input>, etc.
- <form> doit d'abord contenir un bloc (par exemple <div>), qui lui pourra contenir des éléments <input>.

En espérant t'avoir été utile de bon matin Smiley cligne