Recipe Page

Hi @Sumta4real,

Nice project! I noticed a few areas where you could improve:

Footer Positioning: Your footer currently follows the page content. Consider using position: absolute and positioning it at the bottom with bottom: 0 to keep it fixed at the bottom of the viewport.

Responsive Design: Your site isn’t responsive, and the issue seems to stem from not using a mobile-first approach. Think of your project like a tower: mobile is the foundation, and desktop is the top floor. If you start with a desktop-first approach, you'll end up with a lot of problematic CSS for mobile. Instead, build your design for mobile first and then use media queries to adjust for larger screens. This approach will help ensure your page is responsive with minimal CSS.

Hope this was helpful

Best, Teodor

In your code you can make small change that line in nutrition in this last label doesn't have line after that you can add

.recipe-nutrition tr:last-of-type td { border-bottom: none; }

this will remove the last line and rest will be there

and in mobile responsive design the design should be similar to mobile design