@AlyaaRushdy
What are you most proud of, and what would you do differently next time?
Figuring out how to use flexbox as a table, and I think my html was decently semantic.
What challenges did you encounter, and how did you overcome them?
I had a tough time using table element but I ended up changing it to a flexbox instead since it was more responsive.
What specific areas of your project would you like help with?
General feedback is welcomed, and advice on how to make my html more semantic if possible.
@AlyaaRushdy
Posted
try this if you're still interested in making the nutrition part a table
.section__table { width: 100%; border-collapse: collapse; } .section__table__tr td { width: 50%; height: 2.5rem; text-align: left; text-indent: 1.5rem; } .section__table__tr:not(:last-child) { border-bottom: 1px solid var(--Light-Grey); }
Marked as helpful
@TanmayNawlakhe
Submitted
What are you most proud of, and what would you do differently next time?
Mastering HTML structure and CSS styling for a functional social links page, while gaining hands-on experience in web development basics.
What challenges did you encounter, and how did you overcome them?
Challenges encountered included CSS layout issues, browser compatibility issues, and aligning elements properly. To overcome these, I used CSS debugging tools like browser developer tools to inspect and adjust styles. I also researched and implemented CSS flexbox or grid for responsive layouts and tested the page on different browsers to address compatibility issues.
What specific areas of your project would you like help with?
I would like help with improving the responsiveness of my social links page, ensuring it looks good on various screen sizes. Additionally, guidance on organizing CSS styles more efficiently would be appreciated.
@AlyaaRushdy
Posted
Great job on that challenge! to improve the responsiveness of the component try avoiding setting width to the components in pixels. try using rem or em instead. example:
width: clamp(19rem, 88vw, 24rem);
@Jarmovd
Submitted
What are you most proud of, and what would you do differently next time?
I used more display flex this time and using gap instead of adding padding for each element. Would like to use scss and use it for nesting to make my css even cleaner. Might use classes more instead of id's to get used to it for bigger projects with repetetive content.
What challenges did you encounter, and how did you overcome them?
Had some trouble using the svg but eventually I put it in an img tag so I could better scale it for mobile
What specific areas of your project would you like help with?
Happy with how the project developed so no help needed
@AlyaaRushdy
Posted
It looks amazing!
@pouyasdz
Submitted
@AlyaaRushdy
Posted
Amazing Work!
