Pourquoi la balise <center> est-elle déconseillée en HTML?

Je suis simplement curieux de savoir pourquoi <center> balise en HTML a été déconseillée.

Le <center>était un moyen simple de blocs rapidement alignement centre de texte et d' images en encapsulant le conteneur dans une <center>étiquette, et je ne peux pas trouver un moyen plus simple sur la façon de le faire maintenant.

Quelqu'un sait-il une façon simple de centrer les "trucs" (pas la margin-left:auto; margin-right:auto;chose et la largeur), quelque chose qui remplace <center>? Et aussi, pourquoi a-t-il été déprécié?

L' <center>élément est obsolète car il définit la présentation de son contenu - il ne décrit pas son contenu.

Une méthode de centrage consiste à définir les propriétés margin-leftet margin-rightde l'élément sur auto, puis à définir la propriété de l'élément parent text-alignsur center. Cela garantit que l'élément sera centré dans tous les navigateurs modernes.

Selon W3Schools.com ,

L'élément central était obsolète dans HTML 4.01 et n'est pas pris en charge dans XHTML 1.0 Strict DTD.

La spécification HTML 4.01 donne cette raison pour déprécier la balise:

L'élément CENTER équivaut exactement à spécifier l'élément DIV avec l'attribut align défini sur "center".

Ce que je fais, c'est prendre des tâches courantes comme le centrage ou le flottement et en faire des classes CSS. Lorsque je le fais, je peux les utiliser sur n'importe quelle page. Je peux aussi en appeler autant que je veux sur le même élément.

.text_center {text-align: center;}
.center {margin: auto 0px;}
.float_left {float: left;}

Maintenant, je peux les utiliser dans mon code HTML pour effectuer des tâches simples.

<p class="text_center">Some Text</p>

J'utilise toujours la balise <center> parfois parce que rien dans CSS ne fonctionne aussi bien. Exemples d'utilisation d'une astuce <div> et d'un échec:

<div style="text-align: center;">This div is centered, but it's a simple example.</div>
<br />
<div style="text-align: center;"><table border="1"><tr><td>&lt;div style="text-align: center;"&gt; didn't center correctly.</td></tr></table></div>
<br />
<div style="text-align: center;margin-left:auto;margin-right:auto"><table border="1"><tr><td>&lt;div style="text-align: center;margin-left:auto;margin-right:auto"&gt; still didn't center either</td></tr></table></div>
<br />
<center><table border="1"><tr><td>Actually Centered with &lt;center&gt; tag</td></tr></table></center>

<center> obtient des résultats. Pour utiliser CSS à la place, vous devez parfois mettre CSS à plusieurs endroits et jouer avec lui pour le centrer à droite. Pour répondre à votre question, le CSS est devenu une religion avec des croyants et des adeptes qui ont évité <center> <b> <i> <u> comme un blasphème, impie et beaucoup trop simple pour leur propre sécurité d'emploi. Et s'ils essaient de vous retirer votre <table>, demandez-leur quel est l'équivalent CSS de l'attribut colspan ou rowspan.

Ce n'est pas la vérité abstraite ou livresque, mais la vérité vécue qui compte.
- Zen

Vous pouvez toujours l'utiliser avec XHTML 1.0 Transitional et HTML 4.01 Transitional si vous le souhaitez. La seule autre façon (la meilleure façon, à mon avis) est avec des marges:

<div style="width:200px;margin:auto;">
  <p>Hello World</p>
</div>

Votre code HTML doit définir l'élément et non régir sa présentation.

Il est prévu que le balisage, c'est-à-dire les balises HTML, représente le sens et la structure, pas l'apparence. Il a été mal mélangé dans les premières versions de HTML, mais les normes essaient de le nettoyer maintenant.

Le fait de laisser les balises contrôler l'apparence pose un problème: vos pages ne fonctionnent pas bien avec des appareils pour handicapés, tels que des lecteurs d'écran. Cela conduit également à avoir beaucoup, beaucoup de balises dans votre texte qui n'aident pas à clarifier le sens, mais l'encombrent plutôt avec des informations d'un niveau différent.

CSS a donc été conçu pour déplacer la mise en forme / l'affichage dans une langue différente, qui est distincte du texte et peut facilement être conservée de cette façon. Entre autres choses, cela permet de changer de feuille de style pour changer l'apparence d'une page Web sans toucher l'autre balisage. Et pour pouvoir faire ça pour beaucoup de pages en un seul coup de houle.

Les outils que CSS vous donne pour ce faire ne sont pas toujours élégants, je suis de votre côté. Par exemple, il n'y a aucun moyen d'effectuer un centrage vertical efficace. Et le centrage horizontal, s'il ne s'agit pas uniquement de texte text-align, n'est pas beaucoup mieux.

Vous avez le choix de faire facile, efficace et confus ou propre, élégant et encombrant. Je ne comprends pas pourquoi les développeurs Web supportent ce gâchis, mais je suppose qu'ils sont heureux d'avoir au moins une chance de faire leur travail.

HTML est destiné à structurer des données, pas à contrôler la mise en page. CSS est destiné à contrôler la mise en page. Vous constaterez également que de nombreux concepteurs désapprouvent l'utilisation <table>des mises en page pour cette même raison.

Pour le texte et les images, vous pouvez utiliser text-align:

<div style="text-align: center;">
    I'm centered.
</div>

CSS a une text-align: centerpropriété, et puisque c'est purement visuel, pas sémantique, il devrait être relégué en CSS, pas en HTML.

Matière à réflexion: que ferait un synthétiseur de synthèse vocale <center>?

Vous pouvez l'ajouter à votre CSS et l'utiliser <div class="center"></div>

.center{
  text-align: center;
  margin: auto;
  justify-content: center;
  display: flex;
}

ou si vous souhaitez conserver <center></center>et être prêt au cas où il serait supprimé, ajoutez ceci à votre css

center{
  text-align: center;
  margin: auto;
  justify-content: center;
  display: flex;
}

La réponse la moins populaire

1. Une balise obsolète n'est pas nécessairement une mauvaise balise;
2. Il y a des balises qui traitent de la logique de présentation,center est l'un d'entre eux;
3. Une centerbalise n'est pas la même chose qu'une div avec text-align:center;
4. Le fait que vous ayez une autre façon de faire quelque chose ne le rend pas invalide.

Permettez-moi de vous expliquer car il y a des downvoters notoires ici qui penseront que je défends HTML4 oldschool ou quelque chose. Non, je ne suis pas. Mais le débat autour centerest simplement une guerre de tendance, il n'y a aucune vraie raison de laisser tomber une étiquette qui sert bien un but valable.

Voyons donc les principaux arguments contre.

• "Il décrit la présentation, pas la sémantique!"
  Non. Il décrit un arrangement logique - et oui a une apparence par défaut, tout comme les autres balises aiment<p>ou<ul>font. Mais le point est la relation de la partie fermée à son environnement. Le centre dit "c'est quelque chose que nous séparons par un positionnement visuellement différent".

• "Ce n'est pas valable"
  Oui, c'est vrai. Il est juste obsolète, comme dans, pourrait être supprimé plus tard . Depuis 15+ ans maintenant. Et ça ne va nulle part, apparemment. Il existe des sites majeurs qui utilisent cette balise car elle est très lisible et précise.

• "Il n'est pas pris en charge en HTML5"
  C'est en fait l'une desbalisesles plus largement prises en charge.

• "C'est oldschool" Les
  lacets sont aussi oldschool. Les nouvelles méthodes n'invalident pas les anciennes. Vous voulez vous sentir progressif et moderne: bien. Mais n'en faites pas la loi.

• "C'est stupide / maladroit / boiteux / raconte une histoire sur vous"
  Aucun de ceux-ci. C'est comme un marteau: un outil pour un travail spécifique. Il existe d'autres outils pour le même travail et d'autres travaux pour le même outil; mais il a été créé pour résoudre un certain problème et ce problème est toujours là donc nous pourrions aussi bien utiliser une solution dédiée.

• "Vous ne devriez pas faire ça, parce que CSS" Le
  centrage peut absolument être réalisé par CSS mais ce n'est qu'une façon, pas la seule, encore moins la seule appropriée . Tout ce qui est pris en charge, fonctionnel et lisible devrait être correct à utiliser.

TL; DR:

La seule raison de ne pas l'utiliser <center>est que les gens vous détesteront.