[es1]

Mul on OSis display scale 100%, panen erinevates resodes ilusti asjad paika. Peale seda tuleb keegi ja ütleb, et kogu teema on liiga suur, kuna tema display scale on OSis pandud 125%. Kuidas sellist asja ühtsutada, et tema arvutis scaleks lehekülge 25% väiksemalt? Öelda, et pane scaling 100% pole võimalik, ega mõtet, sest see on paljudel läptopidel 125% default, ehk recommended peal.

[Alan]

Kõlab nagu lehekülg ei ole ehitatud "fluid". Kui lehekülg peaks nägema välja erinevate scalede, brauseri zoom levelitega, siis on see "fluid" ja resolutsioonidega kohanema, siis "responsive".

Mis ühikutes suurused CSSis määratud on?
Tuleb CSS-is suuruseid määratleda nõnda, et need oleks sõltuvusest näiteks viewporti suurusest.

https://www.smashingmagazine.com/2016/05/fluid-typography/
https://css-tricks.com/snippets/css/fluid-typography/

Näiteks, kui määrata root elemendile font-size "vw" (view port width)

[mikk36]

See meta tag muudab natuke mängu, sest mobiilsed seadmed eelistavad renderdada teravamalt sel juhul asju. Skaala ei ole enam 1:1 ja mobiiliekraani 1080 px laius ei tähenda, et veebileht oleks 1080 px lai.
DPR 3 puhul näiteks on siis veebilehe laiuseks vaid 360 px. DPR väärtust määrab telefon ise (kasutaja saab seda mõjutada, kui muudab seadistusest skaleeringu/teksti suuruse sätet.

https://developer.mozilla.org/en-US/docs/Web/HTML/Viewport_meta_tag

See võimaldab suurustes kasutada rahulikult px ühikuid edasi.

Edit: tegelikkuses mõjutab see ka desktope, sest ka neil on nüüd levinud skaleerimine. Windows + sülearvuti korral on nüüd üsna levinud näiteks DPR 1.25 ja 1.5 (Settings -> Display -> Scale 125%/150%).

[es1]

Mis mind praegu päästis oli max-height lisamine breakpointi, nii et selle isiku arvutis näeb ka kogu sisu scrollimata ja lahendatud