3 ms·
things like justify-content, align-content, align-items, align-self confuse me, they change based on block and inline settings and the naming is also too indist
by 5350-uiop-1130 2y ago
things like justify-content, align-content, align-items, align-self confuse me, they change based on block and inline settings and the naming is also too indistinct. in the end i just find it frustrating.
sometimes miss the days of table layouts.
i think flex and grid are fine if you stick to the basics. but when you start having nested elements and things like display: content. things can become unmanageable.
- rado 2y agoIn Chrome DevTools, I just enter the required value (center/end) and scroll through the suggested properties until the desired effect is achieved. No need to remember them.
- patates 2y agoThis is exactly how I do it too but I'm not too proud about it. I can propose index changes in a postgres db and explain the reason behind performance improvements but I can't remember the CSS properties that'd put my content in the correct boxes.
- dugmartin 2y agoYou can also click on the little “flex” icon next to the display: flex property and bring up a ui that has all the flex properties (if, like me you can’t remember what property does what)
- nicoburns 2y agoThe naming is super annoying, but for Grid it is least a consistent mapping: - align-* is inline axis. - justify-* is block axis. - *-content is aligning grid tracks (rows/columns). - *-items is aligning individual children within their grid area.
- 5350-uiop-1130 2y agoi find it hard to remember that.