28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous et merci de votre présence,

Je suis en train de refondre les codes HTML et CSS d'un site constitué de tables afin de le constituer uniquement de DIVs.
Le soucis rencontré est le suivant :
Lors de la création d'un div contenant une liste verticale d'image (menu), celles-ci se retrouvent séparées par un espace malgré les recherches impossible de trouver d'où cela provient.
La mise en couleur des bordures d'images prouve toutefois que cela ne provient pas d'elles et la suppression des marges générique (css sur *) ni change rien...
Voici le code HTML :


<div align=center>
	<div id=Tableau_03>
	  <IMG alt="" src="Trait.jpg" width=192><br>
	  <A href="http://xxx.html">
	  <IMG id=test src="test.jpg" width=192 border=0 name=test>
	  </A><br>
	  <A href="http://yyy.html">
	  <IMG id=test2 src="test2.jpg" width=192 border=0 name=test2>
	  </A><br>
			
	</div>
</div>


Le code CSS :

#Tableau_03 {

	background-color: white;
	width: 760px;
	float: none;
}
#test {
	float: none;
	margin: 0px;
	padding: 0px;

}
#test2 {
	float: none;
	margin: 0px;
	padding: 0px;

}


Pour dernière précision, l'affichage des images uniquement (sans les liens) donne le même résultat.

Merci d'avance de votre aide,

Mirliton02
Modifié par mirliton02 (21 Aug 2007 - 21:41)
Si tu fais ça dans ton html :

<DIV align=center>
    <DIV id=Tableau_03>
        <A href="http://xxx.html"><IMG alt="" src="Trait.jpg" width=192></A><BR><A href="http://xxx.html"><IMG id=test src="test.jpg" width=192 border=0 name=test></A><BR><A href="http://yyy.html"><IMG id=test2 src="test2.jpg" width=192 border=0 name=test2></A><BR>
    
    </DIV>
</DIV>


Le résultat est ok, donc le probleme doit être du aux saut de lignes et aux espaces que tu as mis pour mettre en forme le code.

Faut peut etre remplacer ta suite de caractère espace par des tab... mais je sais pas si cela change grand chose
En fait je crois que c'est plutot parce que le lien et l'image se suivent directement :

<DIV align=center>
    <DIV id=Tableau_03>
		<A href="http://xxx.html"><IMG alt="" src="Trait.jpg" width=192></A><BR>
        <A href="http://xxx.html"><IMG id=test src="test.jpg" width=192 border=0 name=test></A><BR>
        <A href="http://yyy.html"><IMG id=test2 src="test2.jpg" width=192 border=0 name=test2></A><BR>
    
    </DIV>
</DIV>
Modérateur
Bonjour mirliton02 et bienvenue parmi nous Smiley smile

En tant que modérateur, je me dois de te faire remarquer que tu n'as malheureusement pas respecté l'une des Règles de base du forum qui est d'afficher les codes et exemples proprement à l'aide des boutons [ code]... ici ton code HTML, CSS, PHP, etc.[ /code] (sans espace).

Je te remercie par avance de bien vouloir éditer ton message afin de le rendre conforme à cette règle. Smiley cligne

D'ailleurs, je rappelle que le lien qui apparaît en bandeau tout en haut du forum ("Nouveau sur le forum ?...") est important. Il contient des pistes de recherche, des indications sur les règles de vie de la communauté, etc.
Si ce n'est déjà fait, il serait courtois de ta part de bien vouloir en prendre connaissance.

Bonne continuation Smiley smile

upload/1-code.gif