responsives Design ohne media queries? - geht!

[Matthias Scharwies]

Servus!

Hallo Matthias,

um ganz ehrlich zu sein: Was da über min(), max() und minmax() steht, scheint mir falsch zu sein.

Ich habe das nur überflogen. Aber in den Kommentaren steht von einem Christopher Kirk-Nielsen:

BTW, for max(), I believe this should read (copy-paste error I presume):

If 60% computes to a value greater than 600px, 
the browser uses 60% as the width. 
On the flip side, if 60% computes to a value 
smaller than 600px, then 600px will be used 
as the element’s width. 

The min() function specifies the absolute smallest size that an element can shrink to.

Nein, andersrum. min() liefert das Minimum zweier Werte. Ich kann mit min() festlegen, welcher Wert nicht überschritten werden soll.

And, hey, we can even set a minimum and maximum range instead using the minmax() function: .box { width: minmax(600px, 50%); }

Nach allem was ich weiß ist das ungültiges CSS. minmax ist Teil der Grid-Spezifikation. width: clamp(600px, 50%, 1000px); wäre etwas, das funktioniert.

Bin ich verwirrt, oder ist es David?

Mir war so, als ob man Werte wie min-content und Funktionen wie minmax() auch anderswo einsetzen könnte; unser Wiki-Artikel verlinkt auf MDN und WhatWG, die das beide nur für Grid sehen.

Ich probier die Tage mal aus und würde dann die Beispiele ins Wiki stellen.

Herzliche Grüße

Matthias Scharwies