Hello, FE-Mentor Crew !
I'm really new to the <details> and <summary> tags so I'd really appreciate any constructive feedback you may have on my solution.
Specifically in relation to the height change when a details section is opened, currently the .accordion-wrapper increases in height from the centre but id like the top of the .accordion-wrapper to stay in place and just extend in height / length from the bottom. Also any advice on how I could improve the illustration placement on desktop as well as hiding the overflow.
Looking forward to starting my next project this afternoon ! Happy <coding /> 💻
@Mtalafa
Posted
Hi Jacksen,
Well done for completing this challenge.
Your card extends from top and bottom because it is centered. So when the height changes it is added from both top and bottom to keep it centered.
I have not tried this, but I`m guessing you can use grid on your accordions to make sure they have the same height and then leave one of them open when the page loads in. This way your box will stay the same height when you open another one.
Marked as helpful
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
