Need help with CSS Flex
https://codepen.io/Yasssh-Patel/pen/xxMOWYw?editors=0100
here is the code but the problem is TopLeft div is working perfectly but all the other divs are not working
9 Replies
You can't select preceeding siblings with CSS, so
.bl ~ can only select elements after it, not before it.
If you don't mind a bit of a hit with browser support, you can do it with :has(), though imo grid is much easier heresorry to bother but i'm new to this i took help of GPT and it suggest the preceeding siblings method can you elaborate with :has() in css or any article it will be great
woahhh🫡 great thanks
haha, was doing it too
https://codepen.io/MarkBoots/pen/BaMzPWm
i didn't understand the code so for explanation is there any artical or topic in CSS that i can search for?
here its all about setting up a grid with grid-template-columns and -rows
when the container
has a specific item that is hovered, then the template changes depending on what item is hoveredfyi chatGPT lies a lot. It’s generally not good to use unless you have a strong enough grasp on the language to spot errors.
https://m.youtube.com/watch?v=_2LwjfYc1x8 also you might find this helpful if you’re confused about how the others did their vars
Kevin Powell
YouTube
Using CSS custom properties like this is a waste
If you're interested in checking out ICodeThis, you can find it here: https://icodethis.com/?ref=kevin and if you want to sign up for one of their premium plans, use KEVIN at checkout for an extra 10% off.
Custom properties are amazing, but a lot of people don’t take advantage of how awesome they are. They set them up in the :root and that’s i...