Recipe Page

Community feedback

• 

  Andrey•2,510

  @dar-juPosted about 2 months ago

  Hi lazyneedle!

  One of the methods to make a page responsive is to use media queries. You can add the code to the bottom of the CSS file:

  @media (max-width: 768px) {
  	.recipe-page {
  		width: initial;
  	}
  }
  

  The code resets the fixed width of the block at a resolution of less than 768 pixels. And your page will become more responsive.

  About the rest of the code:

  • note that the titles H should not be located by the size of the text, but by hierarchy. After H1 comes H2, then H3 and so on. And the font size can be changed in CSS. In this task there is one H1 title, all the others are H2
  • this whole card is a section or an article (depending on how the whole page looks), you do not need to use sections inside, div is suitable for this
  • the omelet image is content, so filling the alt is necessary

  Otherwise, everything is great, good luck with the development!

  Marked as helpful

  1

  ---

  

  P

  lazyneedle•60

  @Iamnotn3rdPosted about 2 months ago

  @dar-ju Thanks a lot for your guideline, sir. I will check all of my solution again. For the responsive design, I plan to redo all of my project after I've completed responsive web design section of Learning Path.

  0