Probleme de mise en forme de menu

[joboy84]

Bonjour,

J ai un petit probleme pour l integration d'une marque blanche...

J'utilise dans ma feuille de style:

* {
  margin: 0px;
  padding: 0px;
}

Ceci me pose aucun probleme sur le site jusqu'a présent, mais la je souhaite intégrer une marque blanche zylom et les images des jeux sont collé les unes au autres, c'est dégueux.

Le problème vient de mon code cité ci-dessus. En effet, en enlevant ce dernier, l'affichage est aéré, mais mes menus bug...

Apercu avec: http://www.voilou.fr/detenteTest.php?s=1&c=2

Apercu sans: http://www.voilou.fr/detenteTest.php?s=2&c=2

Je me suis donc dis que je vais faire un css uniquement pour cette page pour règler le prob, mais je ne vois pas ou est le problème des menus...

Voici le code css des menus:

#menu-de-gauche
{   
   float: left;
   width: 185px; 
}

.block-menu-gauche /* contours de menus gauche */
{
border-left: 1px solid #5CB3BE;
border-right: 1px solid #5CB3BE;
border-bottom: 1px solid #5CB3BE;
margin-bottom: 8px;
width:176px; /*#055E92 */
margin-left:6px;
/*margin-top:0px;*/
background-image:url(/images/design/fondMenu.jpg);
background-repeat: repeat-x;
}

.element_menu ul
{
   list-style-image: url(/images/icones/icone-liste-puce.gif); /* On change l'apparence des puces */
   padding-top:6px; /* Placement a l interieur du menu...espace haut */
   padding-bottom:12px;/* et espace bas */
   padding-left:25px;
}

.element_menu li
{
margin-top:5px; /* On crée un espacement de 5px entre chaque lien */
font-weight: bold;
}

.imageTitreMenusLeft
{
	background-image:  url(/images/design/rubrique-menus.PNG);
	background-repeat: no-repeat;
	height: 26px;
	width: 178px;
	margin-left:6px;
}

.textecentre
{
text-align:center;
padding-top:8px;	
}

Sinon est il possible d'attribuer le

* {
  margin: 0px;
  padding: 0px;
}

Juste au block du menu?

Merci pour votre aide!

Jo

[cyberlaura]

Bonjour,

oui, c'est possible. Voici un exemple de code pour le faire :

#menu-de-gauche {   margin: 0px;   padding: 0px; }

A l'inverse, tu peux aussi appliquer des marges uniquement aux images de ton bloc central :

.block2large img { padding:2px; }

Et juste un petit conseil : utilise firefox avec l'extension web-developper : elle te permet de voir les blocs de ta page, et même de les modifier en direct avec un aperçu immédiat.

[joboy84]

Ta seconde solution fonctionne a merveille

Je vais de ce pas télécharger ton plug in

Merci et bonne journée

[cyberlaura]

De rien et bonne journée aussi.

Sinon, dans mon post précédent, je voulais dire qu'il est possible de modifier les CSS en direct avec l'extension web-developer ( et non pas les blocs )