Looking to hire developers?
Hi. I'm not very proud on this one. I'm facing two issues :
Not responsive. I didn't now how to position the cards this way so I used position: absolute, and flexbox aren't flexible anymore. It just changes the way it displays if screen width is less than 1160px. I'm still wondering how to position it the right way.
I used "::before" to color each box but did not find a way to do it without rewriting the same piece of code four times.
Good luck to everybody on this challenge.
Edit : Changes have been made and everything's working good. Many thanks to you !
@exist08
Posted
I saw your code, you could have use ,
.box::before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height:4px; } /***** ^^This code is Common for every card^^ ****/
and then you could give bgcolor individually one by one to all .box
@pierre-pellegrino
Posted
@exist08 I must have done something wrong before, I followed your advice and it's working great ! Thank you ! :)
@Lusk1nha
Posted
Nice work on this challenge.
I would recommend that you try to use the "display: grid;" to split the cards work better than using the position absolute to position each card. 😃👍
@pierre-pellegrino
Posted
@Lusk1nha I'm kinda scared as I've never used it but I'm definitely giving it a try ! Thank you ! :)
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord
