Shannon Crabill

Posted on Jun 16, 2020

Which CSS concepts do you find confusing?

#discuss #css

Top comments (27)

center aligning a content takes a toll on me, everytime!
do i vertical-align, justify-content, align-item, HOLY GOD!!! I sometimes end up doing everything and pray it works! hahaha.

Ben Calder • Jun 16 '20

For centring things check out CSS -Tricks. They've also got a good resource for Flexbox; so I guess their Grid guide will be good too :)

Saloni Yadav • Jun 17 '20

Oh yes! CSS-Tricks has been my bible for CSS for long now. Flex box, Grid all of the articles as brilliant (bar so so long). Yet, often my browser refuses to obey my knowledge of Centering. Haha. On a different note, try their animation article. That’s also brilliant!

Meg Gutshall • Jun 23 '20

They actually have a guide on centering objects! You're definitely not the only one! Lol! css-tricks.com/centering-css-compl...

Shannon Crabill • Jun 16 '20

Bernard Baker • Jun 16 '20

I took a course on flex box. Feel free to pair up with me on a video call and I can run you through it.

Saloni Yadav • Jun 16 '20

Hey Bernard, that would be great!!

Bernard Baker • Jun 16 '20

Follow me so I can chat with you. And where in the world are you? So we can schedule a video call.

Saloni Yadav • Jun 17 '20 • Edited

I am in India. So live on IST!

Bernard Baker • Jun 17 '20

Ok roughly + 4.5 hours.

Madkour17 • Jun 17 '20

sometimes just margin: auto is enough

Travis Fantina • Jun 16 '20 • Edited

I always confuse justify-content align-items and align-self with Flexbox.

Saloni Yadav • Jun 17 '20

Join the club!! 😂

Dan Fockler • Jun 16 '20

Just getting around to learning CSS Grid. It's really powerful, but the syntax is also pretty complex.

Shannon Crabill • Jun 16 '20

CSS Grid is on my list to learn. I recently used Flexbox for the first time so CSS Grid sounds like a next thing to try out.

Dan Fockler • Jun 16 '20

Nice! Flexbox is pretty awesome. CSS Grid is very similar (uses the same align/justify rules) but 2D instead of just a single row or column of items.

Jonas • Jun 17 '20

I desperately need to learn CSS Grid :)
I'm even thinking of starting a new project just to learn it, hoping interested people will join :)

Bernard Baker • Jun 16 '20

~ confused me. As a selector it selects elements preceded by another. E.g. select all the p tags div ~ p.

<div>
  <p>Foo</p>
  <p>Bar</p>
</div>

Shannon Crabill • Jun 16 '20

Yup, the ~ is one I have to Google how to use too. Selectors are powerful, but not always intuitive.

Bernard Baker • Jun 16 '20

Wouldn't it be great if it allowed regular expressions.

Meg Gutshall • Jun 23 '20

hugogiraudel.github.io/selectors-e... Try this out!

Bernard Baker • Jun 23 '20

That's handy.

Ben Calder • Jun 16 '20

It took me a while to figure out stacking context - that can really mess with your head - but in general I find CSS pretty straightforward these days. Things are much simpler now there are far fewer browser inconsistencies to deal with.

Meg Gutshall • Jun 23 '20 • Edited

I've seen flexbox and CSS grid combined... but I'm not at that level yet. Lol!

Also I still have to bring up the inspect tool real quick to look at the graphic at the bottom of the 'Elements' tab to remember which is margin and which is padding. I always get them mixed up!!