Einrücken nachfolgender Zeilen umbrochenen Etikettentexts
Bei Einschränkungen bei der Formularbreite kann der Etikettentext auf mehrere Zeilen umgebrochen werden, was zu ästhetischen Problemen führt Anliegen. Während die erste Zeile aufgrund des Vorhandenseins eines Eingabeelements eingerückt ist, ist dies bei nachfolgenden Zeilen möglicherweise nicht der Fall, wodurch ein ungleichmäßiges Erscheinungsbild entsteht.
Um eingerückte zweite und nachfolgende Zeilen nur mit CSS zu erzielen, sollten Sie den folgenden Ansatz in Betracht ziehen:
Schließen Sie sowohl das Eingabeelement als auch seine Beschriftung in einen übergeordneten Container mit der Klasse "checkbox-field" ein. Setzen Sie die Anzeigeeigenschaft dieses übergeordneten Elements auf "flex" und die Flex-Richtung auf "row".
.checkbox-field {
display: flex;
flex-direction: row;
}
Beispielverwendung:
Diese Lösung passt den Etikettentext flexibel an die verfügbare Breite an und sorgt gleichzeitig für ein einheitliches visuelles Erscheinungsbild.
Haftungsausschluss: Alle bereitgestellten Ressourcen stammen teilweise aus dem Internet. Wenn eine Verletzung Ihres Urheberrechts oder anderer Rechte und Interessen vorliegt, erläutern Sie bitte die detaillierten Gründe und legen Sie einen Nachweis des Urheberrechts oder Ihrer Rechte und Interessen vor und senden Sie ihn dann an die E-Mail-Adresse: [email protected] Wir werden die Angelegenheit so schnell wie möglich für Sie erledigen.
Copyright© 2022 湘ICP备2022001581号-3