DigitalOcean bietet Cloud-Produkte für jede Phase Ihrer Reise. Starten Sie mit 200 $ kostenlosem Guthaben!
Die min-width Eigenschaft in CSS wird verwendet, um die minimale Breite eines bestimmten Elements festzulegen. Die min-width Eigenschaft überschreibt immer die width Eigenschaft, egal ob sie vor oder nach width in Ihrer Deklaration steht. Autoren dürfen alle Längenwerte verwenden, solange sie positiv sind.
.wrapper {
width: 100%;
min-width: 20em; /* Will be AT LEAST 20em wide */
}
Check out this Pen!
Seien Sie vorsichtig, wenn Sie davon ausgehen, dass min-width vererbt wird, da diese Eigenschaft nicht von anderen Elternelementen geerbt wird. Wenn Autoren eine Breite mit einem absoluten Wert (px, pt, in, cm, mm) definieren, wird die min-width nicht wirksam, da die Breite unbestimmt definiert wurde. Wenn beispielsweise ein Wert von 200px als width-Länge verwendet wird, ist Ihr min-width-Wert von 100px unnötig, da Sie bereits einen absoluten Wert für die width angegeben haben (d. h. 200px). Der beste Weg, min-width zu verwenden, ist, einen width-Wert als Prozentsatz zu definieren und einen absoluten Wert für die min-width Eigenschaft zu verwenden, andernfalls führt die Verwendung eines Prozentwerts sowohl für min-width als auch für width nicht zum erwarteten Ergebnis.
Browser-Unterstützung
| Chrome | Safari | Firefox | Opera | IE | Android | iOS |
|---|---|---|---|---|---|---|
| 24+ | 5.1+ | 18+ | 12.1+ | 8+ | 2.1+ | 3.2+ |
Gibt es eine Umgehungslösung, auf die man bei älteren Browsern achten sollte?
Gibt es irgendwelche* Mein Gott…
Carl,
In dieser Zeit, in der die Mehrheit der Benutzer moderne Browser nutzt, würde ich mir darüber keine Sorgen mehr machen.
Ich komme aus der Zeit von IE 5 & 6, wo man das durchplanen musste, aber das ist nicht mehr der Fall.
@Chris, ich bin überrascht, dass Sie hier keinen Standardwert als einfache Referenz angegeben haben.
Welches Beispiel soll man für min-width css einstellen?
Vielen Dank, ich konnte nirgendwo eine Antwort darauf finden, warum mein min-width nicht funktionierte. Es lag daran, dass ich einen Prozentsatz sowohl für width als auch für min-width verwendet habe, aber meinen Fehler gefunden habe. Danke :)
Hallo,
Gibt es eine Möglichkeit, Tabellenspalten oder Tabellenzellen eine min-width zu geben?
Bitte klären Sie, warum width: 100 % zusammen mit einem absoluten Wert für min-width verwendet wird?
Die min-width Eigenschaft tut nichts. Ich habe alles versucht und es ist wie ein dekoratives Element, das keinen Sinn hat. Ich habe sogar
display: inline-blockversucht, aber das hat nichts bewirkt. Ich beginne mich zu fragen, ob meine CSS-API gehackt wurde.