Responsive Recipe Page

Community feedback

• 

  Dan•210

  @dan9hPosted 9 months ago

  Hey there! Congratulations on completing your first challenge.

  text-indent only indents the first line of the text/paragraph. You should use either padding-left or padding-inline-start for spacing.

  You can try the following:

  ol li {
      padding-left: 20px;
  }
  

  or

  ol li {
      padding-inline-start: 20px;
  }
  

  You can remove position: relative; and margin-left: 25px. They have no effect to the layout.

  And for the nutrition table, well, you can use a <table>. 😂 If this element's new to you, check this very helpful MDN article about HTML Tables.

  Hope this helps!

  Marked as helpful

  1

  ---

  

  Harrison-Jolly•30

  @Harrison-JollyPosted 9 months ago

  @dan9h Thank you!

  Adding padding did the trick. I'm sure I tried that but clearly not. 😂

  0
• 

  Osman Bay•690

  @osmanbay90Posted 9 months ago

  Great job on completing the Frontend Mentor challenge!

  here is css property you can use.

  you can use text-indent for the text and it will give space between the list bulletpoint and the text.

  example

  li {
  text-indent: 50px;
  }
  

  that will move the text to 50px on the right.

  other than that your solution looks great happy coding.

  2
• 

  Bright-Anyawe•30

  @Bright-AnyawePosted 9 months ago

  Wow, that awesome. You've got it all on point, try the following;

  The following syntax will create space between the bullet list and the text items:

  ul li { padding-left: 9px; }

  This will create space between the bullet list and the text items

  1