28220 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

ce topic fait suite à ca http://forum.alsacreations.com/topic.php?fid=4&tid=2154

Donc j'en suis toujours au meme point avec une différence d'interprétation lorsqu'on declare un id et une class.
Je vais tenter d'etre clair.
Soit le code HTML suivant

<div id="x-menu-4">	

	<div id="x-box-3">

	<h1>Sejours a themes</h1>

      	<h2>Venez les d&eacute;couvrir</h2>

      	<p><a title="" href="">&gt;&gt; La D&eacute;couverte</a></p>

      	<p><a title="" href="">&gt;&gt; La D&eacute;tente</a></p>

      	<p><a title="" href="">&gt;&gt; Le Sport</a></p>

      	<br />

	  	<div class="centrer">

	  	<img src="images3/oceania.gif" alt="Cliquer ici" /> <br />

	  	<img src="images3/mascotte.gif" alt="Cliquer ici" /> <br />

	  	<img src="images3/continental.gif" alt="Cliquer ici" />

		</div>

	</div>	

	</div>

et ses CSS associés

#x-box-3 {
	width:					160px;
   border-left: 				gray 1px solid;

	border-bottom:			gray 1px dotted;
	margin-left: 				5px;
	margin-right: 				5px;
	padding-left: 				5px;
	padding-bottom: 		5px;
}

#x-menu-4 {

	width: 				100%;
	padding-top: 			5px;
        background-color: 	   White;

	border-right:			rgb(0,102,153) 2px solid;	

	border-left:			rgb(0,102,153) 2px solid;
}


Dans la logique x-menu-4 est dominant sur le container supérieur. Et pourtant la couleur de fond est creme (couleur container) au lieu de blanc.
De plus si je change de id vers class le x-box-3 j'arrive à avoir ce que je veux.
Si je suis comme dans le code plus haut cela reviens au probleme decrit plus haut

Quelqu'un aurait-il une explication ou un début de pistes ???
Je vous remercie par avance de vos reponses ou aides.

PS : j'ai vraiment tenté de nombreuses choses sans succès
Je viens de mettre a jour le serveur de test afin de voir en réelle ou j'en suis.
Donc pour l'instant ce qui me pose problème :
- pb avec mon div ou class pour le background et les bord droit/gauche
- affichage différent sous IE et Firefox (heureusement légérement mais j'aimerais bien comprendre)
- coin en bas légérement plus large que les autres (dites moi si vous le voyez)
- hauteur des box différentes selon navigateur (alors qu'elles sont fixes height:xx px)
- pour les coupdecoeur j'ai actuellement le prototype suivant <div> les 3 images </div>
et je compte faire un <div> <div pour chaque image></div> [...] </div>
De plus liens direct pour les 2 fichiers CSS associés
http://kwa29.free.fr/Sofibra/images3/base.css
http://kwa29.free.fr/Sofibra/images3/couleurs.css

Voili Voila. J'attend avec impatience vos remarques et commentaires. Smiley ravi
Je vois que tu utiliser plusieurs fois
a écrit :
<div id="x-box-4-c2c">
tu ne peux avoir qu'un seul même id par page, si la même mise en forme doit être utilisée on utilise class.

Un conteneur pour la page serait peut-être pas mal non plus.