DigitalOcean bietet Cloud-Produkte für jede Phase Ihrer Reise. Starten Sie mit 200 $ kostenlosem Guthaben!
Die Eigenschaft max-width in CSS wird verwendet, um die maximale Breite eines bestimmten Elements festzulegen. Die Eigenschaft max-width überschreibt die Eigenschaft width, aber min-width überschreibt immer max-width, unabhängig davon, ob sie vor oder nach width in Ihrer Deklaration steht. Autoren können beliebige Längenwerte verwenden, solange sie positiv sind.
.wrapper {
width: 100%;
max-width: 20em; /* Will be AT MOST 20em wide */
}
.wrapper {
min-width: 50em; /* Overrides max-width */
width: 100%;
max-width: 20em; /* Will be AT MOST 20em wide */
}
Check out this Pen!
Seien Sie vorsichtig, wenn Sie davon ausgehen, dass max-width vererbt wird, da diese Eigenschaft nicht von übergeordneten Elementen geerbt wird. Wenn eine width von 300px mit einer max-width von 600px definiert wurde, überschreibt der anfängliche width-Wert immer den max-width-Wert von 600px.
Browser-Unterstützung
| IE | Edge | Firefox | Chrome | Safari | Opera |
|---|---|---|---|---|---|
| 7+ | Alle | Alle | Alle | Alle | Alle |
| Android Chrome | Android Firefox | Android Browser | iOS Safari | Opera Mobile |
|---|---|---|---|---|
| Alle | Alle | Alle | Alle | Alle |
Gibt es eine Möglichkeit, max-width gleich der Elternbreite zu machen – d.h. das Kind macht seinen Eltern nie breiter?
Danke
Hallo, ist diese Eigenschaft nur ab IE 8 oder höher kompatibel?
Ich habe auf caniuse.com nachgesehen und dort steht, dass die Eigenschaft auch mit IE7 funktioniert. (Tatsächlich überprüfe ich eine Website auf IE7, und die max/min.width-Eigenschaft sieht gut aus ... aber ich möchte sicher sein ...)
Danke und Gruß
img{bricht innerhalb von CSS-Spalten. Es scheint sich auf die Gesamtbreite des Elements zu beziehen, bevor Spalten angewendet werden. Ich hätte lieber, dass max-width sich auf die Breite der Spalte bezieht.max-width: 100%;
}
Kennt jemand eine Lösung? Oder habe ich etwas übersehen?
Danke!
Ich habe drei
<
divs hier ist der Code.
Ich möchte left_nav mit width:100px auf der float:left Seite platzieren,
center_nav in der Mitte mit min-width:200px und max:100%.
das 3. div mit width:300px auf der float:right Seite.
Höhe für alle ist 100%.
das Problem ist, mein center_nav wird vom right_nav verdeckt.
Welchen Code muss ich einfügen, damit center_nav zwischen right_nav und left_nav bleibt?
Max-Width funktioniert nur für Internet Explorer mit einem Strict Doctype: https://msdn.microsoft.com/en-us/library/ie/ms530811%28v=vs.85%29.aspx
Ich habe ein Problem, bei dem meine prozentualen Breiten auf der max-width des Elements basieren und nicht auf der Breite des Elternteils. Kann es nicht herausfinden. Beispiel: Ich habe ein #parent mit einer Breite (und max-width) von 1600px. Ich habe ein #child mit einer max-width von 1800px und einer Breite von 80%. #Child wird mit einer tatsächlichen Breite von 1440 gerendert, nicht 1280.