Hi! You did an awesome job!
Keep an eye out for the spacing. The main content has more padding than it should compared to the original, and should be evenly aligned with the image.
With this project being fairly simple, you don't need to use NPM to use Tailwind CSS, especially if you're only using HTML and some custom CSS.
Next time, I recommend following the instructions on Tailwind's Website to avoid you needing to make extra files like a src file, etc. You can use Tailwind's CDN, add it into your html file in the header, and add your Tailwind properties into that like so:
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- displays site properly based on user's device -->
<link rel="icon" type="image/png" sizes="32x32" href="./assets/images/favicon-32x32.png">
<title>Frontend Mentor | Recipe page</title>
<!-- google fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Outfit:[email protected]&family=Young+Serif&display=swap"
rel="stylesheet">
<!-- Feel free to remove these styles or customise in your own stylesheet 👍 -->
</head>
Hope this helps!
0
