Anselmi Unto Mononeon on Nostr: Varsinkin nuo heightien laskut parent elementien suhteen on melkoista toimintaa :) ...
Varsinkin nuo heightien laskut parent elementien suhteen on melkoista toimintaa :)
Jos tuon div.layout-container määritteistä laittaa sekä sarakkeet ja rivit `min-content minmax(0, 1fr) min-content` ja sitten tekee div.content:ista myös gridin, antaen sille vain `grid-template-rows: min-content minmax(0, 1fr) min-content;` – jolloin sarakkeet pitäisi olla oletuksena täysleveitä – niin pitäisi olla jo selaimellekin melko rigid pohja, mistä laskea elementtejä. Tuon jälkeen div.photolla on jämäkkä koko ja sitten voi laittaa div.photo img:lle vain `{ display: block; height: 100%; width: 100%; object-fit: contain; }`.
Grideissä nuo pelkät fr:t tai autot saattaa aiheuttaa levenemisiä sisällön mukaan, tuo minmax(0, [n]fr) pelaa yleensä varmemmin tuollaisessa sisällön mukaan “staattisemmassa” määrittelyssä :) Ja flex childien alla on myös se heightien lasku vähän semmoista, että asioita tapahtuu.
Jos tuon div.layout-container määritteistä laittaa sekä sarakkeet ja rivit `min-content minmax(0, 1fr) min-content` ja sitten tekee div.content:ista myös gridin, antaen sille vain `grid-template-rows: min-content minmax(0, 1fr) min-content;` – jolloin sarakkeet pitäisi olla oletuksena täysleveitä – niin pitäisi olla jo selaimellekin melko rigid pohja, mistä laskea elementtejä. Tuon jälkeen div.photolla on jämäkkä koko ja sitten voi laittaa div.photo img:lle vain `{ display: block; height: 100%; width: 100%; object-fit: contain; }`.
Grideissä nuo pelkät fr:t tai autot saattaa aiheuttaa levenemisiä sisällön mukaan, tuo minmax(0, [n]fr) pelaa yleensä varmemmin tuollaisessa sisällön mukaan “staattisemmassa” määrittelyssä :) Ja flex childien alla on myös se heightien lasku vähän semmoista, että asioita tapahtuu.