@sisart003Submitted 10 months ago
Recipe Page with react and tailwindcss
pure static, no components and props still decided to post, to keep the motivation going, gonna update time after time.
Edwin Mugo
@EdwinMugoAll comments
- @EdwinMugoPosted 10 months ago
Nice work on this one. However, on larger screens, you should probably make the width of the main container a bit larger, so that the content doesn't appear too squeezed.
Marked as helpful0 - @nonozaSubmitted 10 months ago
Hey guys,
Please review my work. I am not a fan of tables..lol I tried styling it.
- @EdwinMugoSubmitted 10 months ago
Hi everyone,
I'm currently working on this project and using CSS Grid Layout to structure my content. I have defined grid template areas for the columns in my grid layout, but I'm facing an issue where the fractions appear to be unequal, resulting in inconsistent column widths for each card. Despite my efforts, it seems like the grid template areas for columns are not equal, causing inconsistency in the layout. Can anyone help me identify the issue or provide suggestions on how to ensure equal column widths for each card?
Thanks in advance for your assistance!
@EdwinMugoPosted 10 months agoI found the solution to my problem which was that I had not explicitly declared: grid-template-columns:repeat(4, 1fr);
0 - @Marley-SemendeSubmitted 10 months ago
Hi Frontend Mentor Community 👋🏾. I've completed another challenge! I enjoyed building this advice-generator-app with :
- 🚀Semantic HTML
- 🚀CSS Flexbox
- 🚀JavaScript fetch API
For smaller screen sizes 📲, I've added @media query to handle the layout and styling
Things I learnt building this project:
- Using async programming to fetch and handle data from the AdviceSlip Advice API 👨🏾💻
- Adding an
addEventListener()that handled the advice display on button click. Feel free to leave me feedback on my code. Happy coding :)
