@brukmg
Posted
The code you've written has some really nice touches! You've applied a well-structured reset to ensure consistency across browsers, which is always a smart move. I love how you've used variables for colors, font sizes, and border-radius—it makes everything more manageable and scalable.The padding and margin adjustments throughout the layout are thoughtful, ensuring a clean and organized design. Plus, the way you've styled the lists for ingredients and instructions with custom markers adds a great touch of detail. Overall, it’s clear you’ve put a lot of thought into making the page both functional and visually appealing!
For a couple of tweaks, consider switching to a <table> for the nutrition section to enhance accessibility and semantic structure. You can also remove the redundant a:not([class]) style since the .attribution a block already takes care of that. There are a few unnecessary selectors like picture, svg, video, canvas, input, button, textarea, select—those aren’t needed since these elements aren’t used in the HTML. There’s a minor conflict with the padding in .preparation-time and .preparation-list, and a small typo in .intructions and .intructions-list (it should be .instructions).
Overall, it’s clear you've put a lot of thought into making the page both functional and visually appealing—just a few refinements will make it even better!
Marked as helpful
