[falcao1010]

Hallo,

ich habe in meinem Forum kommunalforum.de einen Button installiert, der immer im Vordergrund steht (Link zum newthread). Das klappt auch gut.

Allerdings gefällt mir nicht, dass der Button in der Desktop- und mobilen Ansicht gleich groß ist (Schriftgröße, Breite, Position, usw.).

Ich möchte den Button daher abhängig von der Bildschirmgröße leicht verändern (2 oder vielleicht 3 Versionen).

Hat dazu jemand einen Tipp? Bitte möglichst konkret :-)

[Schnapsnase]

Arbeite im css statt mit px mit % oder vw und vh.
Alternativ kann man ein Media-Query definieren. Dann ist die Größenänderung allerdings stufenweise.

[falcao1010]

Ich habe die px durch eine Formel ersetzt, die ich noch aus anderem Zusammenhang hatte. Was meint Ihr, ist das Ergebnis jetzt so in Ordnung?

[Schnapsnase]

Ich habe die px durch eine Formel ersetzt, die ich noch aus anderem Zusammenhang hatte.

"Deine" Formel kommt mir bekannt vor. Siehe hier  .

Du definierst dort 1900px als 125% Viewportbreite. Kann man machen, aber warum?
Beim groben drüberschauen sieht`s aber eigentlich ganz gut aus.

[falcao1010]

Habe die Formel noch nicht recht verstanden ;-)

Ich finde den Button auf dem Smartphone in der Hochkant-Ansicht noch etwas zu breit. Komme da nicht richtig weiter ...

[Schnapsnase]

Code:

width: calc(120px + (200 - 120) * ((100vw - 320px) / (1900 - 320)));
height: calc(25px + (60 - 25) * ((100vh - 320px) / (1900 - 320)));
font-size: calc(15px + (24 - 15) * ((100vw - 320px) / (1900 - 320)));

Besser?

[falcao1010]

Ja, sehr schön, vielen Dank.