Frontend Mentor Challenge: Recipe Page – Open to suggestions!

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

I'm really proud that I managed to build this almost entirely by myself. At the beginning, I struggled with some things—like aligning everything properly, making the image fill the container, and ensuring the nutrition table looked right—but I kept pushing through and figured it all out step by step. Seeing the final result come together feels great!

If I were to do this again, I’d focus more on spacing and layout planning from the start. I spent a lot of time adjusting margins and paddings to get everything to match the design exactly, and I think with better planning, I could make that process smoother. Other than that, I’m happy with the outcome and open to any feedback to improve it even more!

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

One of the biggest challenges was getting everything to align properly, especially making sure all the elements matched the design exactly. At first, some sections didn’t line up as they should, and the image wasn’t filling the container correctly. I fixed this by carefully adjusting margins, paddings, and making sure the layout was structured properly.

Another challenge was the nutrition table. The text and values weren’t aligning correctly at first, and I had to tweak the table layout and spacing to make it match the design. Through trial and error, I figured out how to properly distribute the space between the text and numbers while keeping it responsive.

Overall, I overcame these challenges by testing different approaches, debugging step by step, and making sure every small detail looked right. It took some time, but I learned a lot in the process!

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

I'm mostly happy with how the project turned out, but I'd love some feedback on a few things:

1️. Spacing & Layout – I spent a lot of time adjusting margins and paddings to get everything aligned properly. Does everything look well-balanced, or is there a better way to approach spacing?

2️. Responsiveness – I think the mobile version looks good, but I want to make sure I handled the layout adjustments in the best way. Are there any improvements I could make to the way it scales?

3. Code Optimization – I feel like some parts of my CSS could be cleaner or more efficient. If you see any redundant code or better ways to structure things, I’d love to hear your suggestions!

Any feedback would be really appreciated!