Définition de la css text-align

Propriété css : text-align

Détails des versions feuilles de style css text-align
css1
css2
Détails de compatiblilité de la feuilles de style css text-align pour les navigateurs
Netscape 4.78
Netscape 6+
Internet Explorer 4+
Mozilla + et Firefox +
Safari 1 +
Chrome +
Flash MX

Définition de text-align

La propriété de feuille de style css text-align permet de spécifier l'alignement horizontal du texte.
Exemple de code :
text-align : left;
text-align : center;
text-align : right;
text-align : justify;
text-align : ".";

La propriété de feuille de style text-align css peut prendre la valeur de :
- left, alignement du texte gauche,
- center, alignement du texte au milieu,
- right, alignement du texte à droite,
- justify, alignement du texte à droite et à gauche.
- chaîne, spécifie une chaîne sur laquelle les cellules d'un tableau vont s'aligner. Utilisée seulement pour le cellules d'un tableau (reconnue par aucun navigateur).
- inherit, hérite de la propriété du son parent(css2).

Exemple de code text-align

Application des text-align

La propriété de feuille de style text-align css est applicable sur l'ensemble des balises HTML ou XHTML de type block ou inline (p, div, td, ...).

L'équivalence de la feuille de style text-align css en HTML est : l'attribut HTML ALIGN des balises HTML.

Héritage des text-align

Les balises filles HTML ou XHTML héritent de la propriété.

Flash mx des text-align

Pour les utilisateurs de Flash MX, l'équivalence actionscript de la feuille de style css text-align est textAlign.

Problèmes des text-align

La propriété de feuille de style css text-align ne pose aucun problème d'interprétation, sauf pour la valeur text-align : chaîne qui ne semble pas être reconnue par aucun navigateur.

FAQ

Répond aux questions suivantes :

Comment définir l'alignement horizontal d'un texte?
Liste des questions les plus fréquemment posées en css.

Exemples et astuces css

Alignement horizontal de block.

Il se peut que vous ayez besoin de centrer horizontalement un bloc dans un bloc div.
Sous Internet Explorer un simple text-align:center dans les propriété de style du parent permet de centrer le bloc fils. Cependant pour Firefox cela ne fonctionne pas.
Pour cela, vous pouvez utiliser une technique bien connue qui consiste à spécifier les marges droite et gauche en auto.
Feuille de style CSS :
Exemple de code :
#fils{
width:150px;
height:150px;
border:1px solid red;
margin-right: auto;
margin-left: auto;
}
#parent{
border:1px solid green;
width:350px;
height:160px;
}
Code HTML :
Exemple de code :
<div id="parent">
  <div id="fils">Mon bloc centré horizontalement</div>
</div>

Résultat :
Mon bloc centré horizontalement

Cette technique devrait marcher sous tous les navigateurs, mais cela reste à tester.
Cette technique ne fonctionnent pas pour le centrage vertical.

BUG INTERNAUTE

Explication

Vous trouverez ci-dessous divers bugs d'interprétation de la css text-align.
Ces bugs ont été transmis par les internautes du site.

J'ai vérifié certains bugs mais pour la plupart, ils sont soit sur MAC soit sur un navigateur que je ne possède pas.
Ceux que j'ai pu visualiser sont notés
Bug vérifié : oui.

Reporter un bug

Voir les Bugs[1]

VOTRE AVIS

Notez cette page

  • 1/5
  • 2/5
  • 3/5
  • 4/5
  • 5/5
Avis sur la page http://www.zonecss.fr/style_css/feuille_css_text_align.html Votes: 4.4 / 5 - 16 votes
Cliquez sur une étoile pour voter.

Reporter un bug ou problème d'interprétationavec la propriété text-align
La balise HTML et XHTML P crée un paragraphe. Après chaque balise de fin </P>, il se génère un saut de ligne.<P> </P> Le saut de ligne correspond à ...[Voir]La balise HTML et XHTML DIV permet de regrouper plusieurs éléments HTML et XHTML .<DIV> </DIV> La balise HTML et XHTML DIV est aussi utilisée pour fa...[Voir]La balise HTML et XHTML TD définit une cellule du tableau. La balise HTML et XHTML TD est contenu dans la balise HTML et XHTML <TR>. Exemple :<TABLE> ...[Voir]