Recipe Page

Community feedback

• 

  P

  Teodor Jenkler•3,820

  @TedJenklerPosted 3 months ago

  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

  Marked as helpful

  1

  ---

  

  Taiwo Sumayyah•150

  @Sumta4realPosted 3 months ago

  Thanks @TedJenkler

  Yeah! The feedback is helpful

  1
• 

  Yashi Singh•340

  @Yashi-Singh-1Posted 3 months ago

  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

  Marked as helpful

  0