Skip to content
Submitted over 1 year ago

Responsive recipe page built with html and css

Gift Amachree•870
@jen67
A solution to the Recipe page challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

Hi everyone,

I just finished this coding challenge, and I'm excited to hear your thoughts and suggestions! 🚀

Thanks in advance for your input!

Code

Please log in to post a comment

Log in

Community feedback

  • Awais Ahmad•20
    @awaisahmad64

    you completed an awesome pixel-perfect design.

  • Ibrahim Mohammed•640
    @MohammedOnGit

    Hello Gift Amachree!

    Congratulations on completing the challenge. You did awesome! However, looking at your "Design Comparison" solution, I presume you completed the project using your best judgment.

    I recommend Pixel Perfect Pro for you. It is a Chrome extension that allows you to upload the Frontend Mentor's design pictures directly onto your browser. This will aid you in comparing your design with the project design specifications while you code. With this tool, you are likely to create a nearly perfect solution, if not pixel-perfect, in the future.

    You can search for the tool or use the link below to download it.

    Happy coding!

    NB: I am not sponsored by the developers of the tool in any way.

  • Sivaprasath•2,500
    @sivaprasath2004

    Hello i`ll wishing for your completion project solution.

    • Nice solution. It`s proper HTML structure format .

    • If I want to recommend the <article> Ex: <div class="Instructions"></div> to use the <article></article>

    • The <article> tag in HTML, introduced with HTML5, serves a vital role in structuring web content. It delineates a self-contained and cohesive piece of content within a webpage, such as blog posts, news articles, forum posts, or even comments. Its purpose is to encapsulate content that could be distributed or reused independently.

    • By employing <article>, developers can semantically differentiate the primary content from peripheral elements on the page, aiding both search engines and assistive technologies in comprehending the significance of the encapsulated content. Typically, an <article> element includes a heading, usually marked up with <h1> to <h6>, providing a clear title or headline for the contained content.

    • This tag's usage aligns with the broader efforts in HTML5 towards improving the semantic structure of web documents, fostering accessibility, search engine optimization (SEO), and overall maintainability of websites.

  • FabFalch•130
    @FabFalch

    Just submitted mine so looking at others! Looks great! I've just checked out your README for this project also, I'm looking to see how I can improve my future README's for upcoming projects.

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