Mobile-first solution using CSS Flexbox and Javascript

Solution retrospective
I struggled a lot positioning the images. Which approch or properties would be better for this kind of layout?
Please log in to post a comment
Log in with GitHubCommunity feedback
- Account deleted
How about you expand the clicking area to expand a bar, instead of it only being limited to the arrow, you could also add it to the question to make things easier.
No pressure, but implementing the 'one tab at a time' functionality would be nice.
Keep coding👍.
Marked as helpful - @daniloscunha
Good morning Bianca,
There's a step-by-step video of this challenge. [Coder coder channel] (https://www.youtube.com/watch?v=FboXxLxg8eo&t=3135s)
Maybe will help you to understand the image positioning process.
Marked as helpful - @SheGeeks
For the HTML validation errors you're receiving, change
section
todiv
. Section tags should come with a heading (h2 and up) immediately after the opening tag for accessibility. When this doesn't happen you'll receive these kind of errors. Div tags don't have this requirement, which is why I'm recommending switching tags.This challenge is primarily about positioning elements. I spent time researching how each position property worked to better inform which one I should use and where it worked best. Feel free to take a look at my code on this challenge for inspiration.
Join our Discord community
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