28173 sujets

CSS et mise en forme, CSS3

Bonjour,

J'essaie de créer un menu pour mon site. Je voudrai que chaque rubrique soit illustrée par une image et, en dessous de celle-ci, un texte descriptif centé.

Voilà mon code :


#menu_rub{
float: left;    /*A la gauche du menu, un bloc contient la page correspondante*/
width: 130px;
margin: 0px;
padding: 0px;
padding: 0px;
background: red;
}

p#menu_rub{
text-indent: 0px; 
text-align: center;
background: green;
border: 3px solid gray;
}


Html :
				
<div id="menu_rub">
  <img src="/Photos/rub_1.jpg" class="ImgCat" alt="Couverture du livre" width="86" height="78"/>
  <p id="menu_rub">Boites sous vide sdf sdfsd  fsd f sd f sdf sd fsd</p>
</div>


Résultat: C'est comme si l'indentation ne disparaissait pas: la première ligne du paragraphe est décalée par rapport au bord gauche du bloc.

J'ai fait pas mal d'essais, sans résultat. Quelqu'un aurait une piste ?
Bonsoir,
Pour commencer tu ne peux pas avoir 2 fois le même id (id="menu_rub")dans la même page, celui-ci devant être unique.
Décentrer la première ligne d'une texte centré n'est pas très cohérent,
tu devrais plutôt faire en sorte d'ajouter le nombre de mots nécessaire pour remplir ta première ligne.
Le text-indent:0 n'a aucun effet puisque c'est sa valeur par default
et il n'est pas fait pour ça.
Ok, pour d'Id, je débute en css, une étourderie. j'ai remplacé les # par des . , dans le html les id par class. Rien n'a changé

Le décentrage n'est pas voulu. Je veux simplement avoir le texte centré dans le bloc. Seulement, le paragraphe se comporte comme si l'indentation subsistait : la première ligne est décalée, les autres non. Si je réduis le texte pour qu'il tienne sur une ligne, le décalage à gauche subsiste.
Salut.

Le texte devrait effectivement être centré si tu as corrigé le problème dans les id. Le reste des styles est-il bien appliqué (la couleur, l'arrière-plan ...) ?

Tu n'aurais pas une page en ligne ou un screenshot pour visualiser le soucis ?