Pourquoi mon élément ne s'affiche-t-il pas en ligne?
J'essaie d'Appliquer display: inline;
à l'élément <legend>
dans mon élément <fieldset>
, de sorte que le <span>
suivant suivra sur la même ligne, mais mon CSS n'a aucun effet.
legend{
display: inline;
}
span {
display: inline;
}
<fieldset>
<legend>Legend</legend>
<span>Follower</span>
</fieldset>
Modifier
Je n'ai aucun contrôle sur le HTML; Je ne peux que modifier CSS
2 réponses
Les légendes sont spéciales. En particulier, leur rendu par défaut ne peut pas être décrit en CSS, de sorte que les navigateurs utilisent des moyens non-CSS pour les rendre. Cela signifie qu'une légende positionnée statiquement sera traitée comme une légende et sera séparée du contenu réel du fieldset.
Le bizarre ne s'arrête pas là; si vous inversez l'ordre de la durée et de la légende, la légende apparaîtra toujours dans la plupart des navigateurs (mais pas dans Opera, apparemment).
Les Légendes n'acceptent tout simplement pas display: inline
ou display: inline-block
, mais vous pouvez le donner float: left
et il s'affichera de la même manière que ce que vous voulez.