[Résolu] Table-cell - centrer horizontalement le contenu ?

Bonjour,

Pardon pour le dérangement, mais j'ai une petite question (sans doute) tout bête sur laquelle je bute :

Comment centrer horizontalement le contenu d'une cellule définie en tant que table-cell ?

(Pour centrer verticalement, il y a

vertical-align: middle

; mais horizontalement ?

text-align: center

et

margin-left: auto; margin-right: auto;

ne semblent pas fonctionner.

Merci d'avance de votre aide.

bonjour,

text-align , c'est pour le texte, si il s'agit de centrer des balises de type block, elles occupent 100% de la largeur disponible.

As tu un exemple de code qui démontre ton soucis ?

cdt

Bonsoir gcyrillus,

Merci de ta réponse.

Voici les codes html et css :

<header>
	  
		<p class="titre">Quelques règles de logique arithmétique<br>
		Quand une grandeur G est définie par une fraction</p>
		
  </header>

header {	
	
	width: 740px;
	margin-top:10px;
	margin-left: auto;
	margin-right: auto;
	border: 2px solid FireBrick;
}

header p.titre {
	
	display: table-cell;
	vertical-align: middle;
	padding-left:200px;
	height: 60px;
	font-weight: bold;
	font-size: 12px;
	line-height: 25px;
}

Je veux pouvoir centrer le paragraphe horizontalement

Re bonsoir,
tu peut faire depuis le parent:

exemple

header {		
	width: 740px;
	margin-top:10px;
	margin-left: auto;
	margin-right: auto;
	border: 2px solid FireBrick;
  display:grid;
  justify-content:center;
}

Cela te fait une grille d'une colonne, pas de soucis si tu en ajoutes un autre, il sera dessous, et le plus large donnera les alignement gauche/droite des autres .

exemple de possibilités https://codepen.io/gc-nomade/pen/ZEezoGd
Modifié par gcyrillus (04 May 2021 - 22:38)