What are you most proud of, and what would you do differently next time?
I am proud that I was able to work through the HTML smoothly. I used ordered and unordered lists and a simple table. I am proud that I worked through difficulties getting the content to fit the container and that my final solution is pretty close to the design.
My @media query seems to work and I was able to get that mostly how I wanted it on the first try.
What challenges did you encounter, and how did you overcome them?
I had trouble getting the content to fit the container. I solved this by setting the font-size to 55%. I used 20% for the mobile version. Not sure this is best practice, but it did work.
I also had trouble with sizing/spacing. I did not have the Figma files and realize how useful these are. Had to use trial and error, which takes much longer. I also had trouble getting the black background, with the lighter inner container. I was able to get this to work by adding an .outer-container outside the .card-container.
What specific areas of your project would you like help with?
Not sure if using the 50% font-size is the correct way to size this, so I'd love feedback on that. I appreciate any other feedback. Thanks so much!
@Axsel519
Posted
use this body { background-color: var(--Stone100);}
.card-container { display: flex; flex-direction: column; justify-content: start; align-items: left; background-color: white; width: 70vw; height: max-content; padding: 25px; border-radius: 15px; }
Marked as helpful
@Luis-Roldan
Posted
Greetings jvondungen!
good work with the challenge. Just an advice, to check the paddings and margins that are between the texts.
Keep up the good work!
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
