Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

I used HTML for structuring the website and after that used CSS

@Zeeshan-Haider0

Desktop design screenshot for the Recipe page coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

This was my third day into the web development and I tried my best and put the knowledge to use as far as I could. Hopefully I will learn more and master my skills and get better. I tried my skills just to practise the knowledge that i have about html and css so far This was a pretty good experience But im not proud of what I made :(

What challenges did you encounter, and how did you overcome them?

As a complete beginner it was tough and I did everything on my own

What specific areas of your project would you like help with?

As new to webdevelopment I didnt new how to customize that preperation time box and the nutrition table so i would definetely hope someone could help me there

Community feedback

@Junbol

Posted

ok first do that first. You can if you want create a totally new repository in GitHub and call it: recipe-page-main

then add that remote to your local repository: git remote add origin <url of your GitHub remote repository which it will have the name: recipe-page-main> To do all this read the README.md file:

Feel free to use any workflow that you feel comfortable with. Below is a suggested process, but do not feel like you need to follow these steps:

  1. Initialize your project as a public repository on GitHub. Creating a repo will make it easier to share your code with the community if you need help. If you're not sure how to do this, have a read-through of this Try Git resource.
  2. Configure your repository to publish your code to a web address. This will also be useful if you need some help during a challenge as you can share the URL for your project with your repo URL. There are a number of ways to do this, and we provide some recommendations below.
  3. Look through the designs to start planning out how you'll tackle the project. This step is crucial to help you think ahead for CSS classes to create reusable styles.
  4. Before adding any styles, structure your content with HTML. Writing your HTML first can help focus your attention on creating well-structured content.
  5. Write out the base styles for your project, including general content styles, such as font-family and font-size.
  6. Start adding styles to the top of the page and work down. Only move on to the next section once you're happy you've completed the area you're working on.

Marked as helpful

0

@Ranty09

Posted

Hello Zeeshan. Kudos for taking a bold step. In addition, I want to advise you to always ensure that the file path in your code matches the actual file path in your repository to make your image visible. I also want to encourage you to use table element and table row in the "Nutrition" segment.

Marked as helpful

0

@Zeeshan-Haider0

Posted

Hi Ranti, I learned from my mistake. I have fixed it now and gave it the right path and yes I still don't quite understand the tables in html I will have to go through them again. Although, it's a new journey and I have a long way to go and to keep learning. Thank you for the tip ! @Ranty09

0

@Junbol

Posted

Hi Zeeshan, I think I might guess what is going on. My tip for you for now is to delete the repository you have now and create a new one but this time make recipe-page-main the repository and not nested inside another parent repository like it is now.

Cheers

Junier

Marked as helpful

0

@Zeeshan-Haider0

Posted

I appreciate it mate, I'm new to coding and a little tip means alot. Thanks! @Junbol

0

Please log in to post a comment

Log in with GitHub
Discord logo

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