Balises inline vs block

Bonjour à tous
Une des choses qui restent de l'antiquité du web est le fait que les navigateurs vérifient plus ou moins que le code HTML respecte bien la nature des balises.
Par exemple si on écrit

<p>.......<div>.....</div>...</p>

Le navigateur, lors de l'analyse du HTML, remplace par

<p>...</p><div>....</div><p>...</p>

Mais depuis HTML5, on peut styler le <div> interne en display:inline ou display:inline-block et donc ce pourrait ne pas être une erreur, seulement l'analyse du HTML précède l'application du CSS, donc c'est toujours refusé.
Pour se sortir de cette situation, ou peut bien entendu remplacer <div> par <span>, mais le même problème va se poser à l'intérieur du <span>.
La solution est de mettre <div> à l'intérieur d'un <button>, car un <p> peut contenir un <button>. Noter que <button> est à ma connaissance la seule balise que le navigateur considère comme un inline-block (sans doute parce qu'originellement un <button> était inline)

Quand on utilise des balises nouvelles HTML5, on n'arrive plus très bien à s'y retrouver.
Par exemple:
1) que peut on mettre dans un <fieldset> ? Par exemple peut on écrire

<fieldset>
  <ul>
    <li><label...><input></li>
    <li><label...><input></li>
    ...
</fieldset>

a priori oui, mais je ne suis pas sûr que tous les navigateurs se comportent de la même façon.

Autre point: quelles vérifications sont appliquées lorsque l'on manipule le DOM ?
J'ai vu par exemple qu'on peut écrire

<p>......</p>
<aside>...</aside>

puis déplacer <aside> par manipulation du DOM
C'est ce que je faisais avant de découvrir que

<p>.....
  <button>.....
      <aside>....</aside>
  ....</button>
....</p>

marche fort bien.

Si l'essentiel du code HTML est généré dynamiquement en JavaScript, quelles sont les vérifications qui sont effectuées par le navigateur?

Connaissez vous un document clair sur ce sujet?
Merci de votre aide
Modifié par PapyJP (30 May 2020 - 17:48)

Et l'inconvénient d'être fonctionnel et non valide, c'est que les navigateurs ne sont pas forcément tenu à ce que cela reste fonctionnel dans de futures versions.

Désolé de n'avoir pu répondre plus tôt.
Si on regarde le style d'une balise <button> sur les outils de développement de FireFox ou de Google Chrome, on constate que la valeur par défaut de "display" est "inline-block", c'est ce qui m'a permis d'obtenir le résultat souhaité.
Je n'imagine pas que les producteurs de navigateurs internet décident de remettre cette valeur par défaut à "inine", car je ne dois pas être le seul à tirer parti de cette propriété. Cela serait considéré comme un bug par tous ces utilisateurs et serait rapidement corrigé, je pense.
S'il y a une différence entre le standard et ces implémentations, c'est plutôt le standard qui devrait être modifié.

Pour info : Raphaël a raison, c'est bien dans ce sens-là que j'entendais "valide". Si on crée une norme (quelle qu'elle soit), et qu'une chose (concernée par cette norme, évidemment) la respecte, alors elle est valide. Sinon, elle ne l'est pas.
Exemple typique : beaucoup de templates d'e-mailing contiennent du code invalide, fonctionnel certes, mais invalide. Et ça peut créer une situation problématique, car le fait que la chose soit fonctionnelle dépend alors directement de la souplesse d'interprétation de la norme par ton outil (ton navigateur en l'occurrence).
Si tu fais un code qui respecte la norme, il est supposé être rendu correctement par tous les navigateurs, ce qui minimise ton risque.

Je suis tout à fait favorable à suivre les standards, je suis très heureux qu'ils existent et facilitent a structuration du code. Cela ne me pose aucun problème pour autant
1) que ces standards soient supportés par les navigateurs utilisés par les personnes qui accèdent à notre site
2) ces standards soient cohérents

A l'origine ma question vient de ce que j'aimerais trouver un document qui décrivent l'utilisation des balises HTML5/CSS3

Or ce que je constate, c'est que CSS3 permet de donner des propriétés telles que display:inline-block mais que si on essaie de les utiliser, on constate que c'est extrêmement difficile car la vérification du code HTML se fait pratiquement comme si ces propriétés étaient non standard: les navigateurs commencent par valider le code HTML et à le compléter sur les bases du HTML d'il y a 25 ans sans tenir compte que le CSS permet d'ajouter les propriétés en question.