Ich versuche mich zu bewerben display: inline; zum <legend> Element in meinem <fieldset> Element, so dass das Folgende <span> wird in der gleichen Zeile folgen, aber mein CSS hat keine Wirkung.
Legenden sind etwas Besonderes. Insbesondere ihre Standardwiedergabe kann nicht in CSS beschrieben werden, sodass Browser Nicht-CSS-Mittel verwenden, um sie darzustellen. Das bedeutet, dass eine statisch positionierte Legende wie eine Legende behandelt wird und vom eigentlichen Inhalt des Fieldsets getrennt ist.
Das Seltsame endet hier nicht; Wenn Sie die Reihenfolge der Spanne und der Legende umkehren, wird die Legende still werden in den meisten Browsern oben angezeigt (aber anscheinend nicht in Opera).
“Standard-Rendering kann nicht in CSS beschrieben werden” Was bedeutet das und warum ist das so? Klingt für mich nach einer schlechten Möglichkeit, HTML-Elemente zu implementieren.
– TylerH
28. April 2015 um 15:58 Uhr
Es bedeutet, was es sagt: Das traditionelle Fieldset-Rendering kann eigentlich nicht in CSS ausgedrückt werden. Insbesondere die Tatsache, dass die Legende das Fieldset nach Bedarf breiter macht und die Art und Weise, wie die Umrandung des Fieldsets die Legende umgibt.
– Boris Zbarsky
28. April 2015 um 20:23 Uhr
Legenden akzeptieren einfach nicht display: inline oder display: inline-blockaber du kannst es geben float: left und es wird ähnlich wie gewünscht angezeigt.
Das funktioniert bei mir mit Firefox 51.0.1 und IE 11, aber ist das zuverlässig?
– R. Schreurs
6. März 2017 um 12:17 Uhr
@R.Schreurs Ich hatte viel Erfolg damit … Ich benutze auch width: fit-content für die Legende, wenn ich IE 11/Edge nicht unterstütze
– kzh
7. März 2017 um 14:19 Uhr
11461400cookie-checkWarum nicht meine Elementanzeige inline?yes
<legend>
Elemente sind “zwielichtig”. Haben Sie darüber nachgedacht, die einfach zu verschieben<span>
innerhalb der<legend>
?– dreißig Punkte
28. April 2011 um 12:59 Uhr
Kannst du nicht 2 Spannen drinnen machen?
legend
tun, was du willst?<legend><span>Legend</span><span>Follower</span></legend>
– Bazz
28. April 2011 um 13:01 Uhr
habe die Frage bearbeitet, um das Problem klarer zu machen.
– Leichter Flaum
28. April 2011 um 13:13 Uhr
Verwandtes Problem in Bugzilla von Firefox bugzilla.mozilla.org/show_bug.cgi?id=653870
– Mike Gifford
13. April 2014 um 13:52 Uhr
Verwandtes Problem im Bug-Tracker von Chrome: code.google.com/p/chromium/issues/detail?id=481983
– TylerH
28. April 2015 um 15:51 Uhr