Warum haben Buttons mit nur Icons diesen Text ​?
Ich bin neugierig, welchen Zweck er erfüllt, da er mein Styling für Buttons mit nur Icons durcheinanderbringt ![]()
Warum haben Buttons mit nur Icons diesen Text ​?
Ich bin neugierig, welchen Zweck er erfüllt, da er mein Styling für Buttons mit nur Icons durcheinanderbringt ![]()
Sie können eine Beschreibung von pmusaraj sehen, warum, von diesem PR:
Dies sorgt für eine konsistente Größe von Texteingaben, Dropdowns und Schaltflächen in der gesamten App. Dies ist wichtig, da diese Elemente oft zusammen in Formularen verwendet werden und unterschiedliche berechnete Höhen viele Layoutprobleme verursachen.
Zugehöriger Code:
Es scheint, als gäbe es eine robustere Methode, um denselben Effekt zu erzielen, ohne ZeroWidthSpace zu verwenden.
Du könntest Recht haben! Es ist ein PR von 2021. Es gibt vielleicht eine moderne Methode, um Konsistenz im Jahr 2024+ sicherzustellen.
Ja, wir haben das schon einmal in Betracht gezogen (und werden es wahrscheinlich wieder tun), aber leider wäre etwas so Einfaches wie das Hinzufügen einer Mindesthöhe zu allen Schaltflächen für bestehende Themes störender.
Warum Mindesthöhe? Könnten die Schaltflächen eine Basis-Abstand/Schriftart einschließlich Zeilenhöhe haben, die der Größe von Dropdowns/Eingabefeldern entspricht?
Ich denke, wir arbeiten auf einen Zustand hin, in dem die Dinge standardisierter sind und dies möglich werden könnte, aber die Zeilenhöhe kann je nach Schriftart variieren … daher könnte alles, was wir standardmäßig tun, zu inkonsistenten Höhen führen, sobald ein Theme zu einer anderen Schriftart wechselt.
Der Nullbreiten-Leerzeichen stellt sicher, dass auch bei Änderungen der Zeilenhöhe und der Schriftart Schaltflächen ohne Text ähnliche Verhaltensweisen wie Schaltflächen mit Text aufweisen (mit anderen Worten, die Zeilenhöhe des Nullbreiten-Zeichens beeinflusst die Schaltflächenhöhe genauso wie Schaltflächen mit Text).
Würde eine einheitliche Schriftart über die Elemente hinweg nicht die gleiche Zeilenhöhe verwenden und somit unterschiedliche Zeilenhöhen der Schriftarten verhindern?
Nein, da Buttons ohne Text keine von der Zeilenhöhe beeinflusste Höhe haben, Buttons mit Text jedoch schon, was zu Inkonsistenzen zwischen Buttons mit und ohne Text führt.
Könnte die Höhe des Icons nicht an die Zeilenhöhe der Schriftart gebunden sein? Ich stelle mir eine @function vor, die die Schriftartdetails/Token aufnimmt und die Zeilenhöhe auf die Höhe des Icons anwendet.
Das. Die CSS lh-Einheit wird in modernen Browsern gut unterstützt, sodass die aktuelle Zeilenhöhe auf ein Element angewendet werden kann, ist jetzt ziemlich einfach.
Aber natürlich kenne ich die Komplexität von Änderungen, ohne bestehende Themes zu beschädigen, nicht.