Naptár három CSS sorban

, Author

Nem dolgoztam még sokat a CSS Griddel, és ez remek lehetőségnek tűnt, hogy kipróbáljam. A naptáramhoz a dátumokat egy pszeudoelembe helyeztem át, amely a counter()-t használja az automatikus inkrementáláshoz, így lehetővé tettem, hogy az egyes dátumokon belül tartalmat írhassak anélkül, hogy további elemekkel kellene elválasztanom őket.

A Grid eltolását is CSS-változóvá tettem, így könnyebb volt ugyanazt a kódot több hónaphoz újrafelhasználni, és egy kis egyszerű vanilla JS-t használtam egy extra osztály alkalmazásához a mai dátumhoz, így az egy kicsit jobban kiemelkedik.

De ahogy mondtam… Új vagyok a Gridben, és a legnagyobb “oopsie”, amibe állandóan belefutok, az az, hogy a Grid kisebb képernyőkön összeomlik.

Asztali számítógépen jól néz ki, de amint elérsz egy bizonyos töréspontot, a tényleges naptárelemek a rettegett CSS-áramlási problémáknak lesznek kitéve. Próbáltam beállítani a wrapper elemet, hogy megadjam a maximális szélességet, de úgy tűnik, ez nem oldja meg a problémát. Szóval ez egy Grid dolog, amit valaki felvilágosíthatna egy újoncot, vagy csak kihagyok valamit?

Vélemény, hozzászólás?

Az e-mail-címet nem tesszük közzé.