Responsive recipe page using only HTML and CSS
Solution retrospective
Now that I have finished this challenge, I have a few questions about my work.
Is my page actually responsive to mobile phones by using @media? Did I use media right?
My html writing is correct? In terms of semantic and hierarchy
What can I change? How can I improve?
Please log in to post a comment
Log in with GitHubCommunity feedback
- @MelvinAguilar
Hello there 👋. Good job on completing the challenge !
I have some suggestions about your code that might interest you.
- The indentation of the code is inconsistent, making it difficult to read and understand. It's recommended to use a code formatter tool, such as Prettier, in your code editor to automatically format your code and maintain consistent indentation.
- For instance, you've placed your
<footer>tag outside the<body>tag, which is incorrect.
- For instance, you've placed your
-
The media query is fine, but you can enhance the width by directly using
max-widthwith a fixed value instead of usingwidth: 50%;. -
Consider replacing "Your Name Here" in the footer with your actual name/nickname.
-
Instead of
<div class="main">, you could use a landmark element<main>. -
It might be beneficial to separate styles into another file to organize the code more efficiently.
I hope you find it useful! 😄 Above all, the solution you submitted is great!
Happy coding!
- The indentation of the code is inconsistent, making it difficult to read and understand. It's recommended to use a code formatter tool, such as Prettier, in your code editor to automatically format your code and maintain consistent indentation.
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