Recipe-Page-Hannibal

Community feedback

• 

  Riktam Nandi•210

  @rdxnandiPosted 6 months ago

  Nice Work

  Marked as helpful

  0
• 

  Bálint Korpai•620

  @kemenyfa-szuPosted 7 months ago

  Hello @hannibal1631!

  Congratulations on finishing this FrontendMentor challenge! Well done!

  • The glitch you mentioned is caused by a list-style-position: inside; property on your <li> element. That makes the list marker part of the li element and moves with it when you apply a margin or padding property on the <li> element. Also you set a margin-left: 10px only on the <strong> element in the list item so only the <strong> element is pushed to the right. Use the margin-left on the <li> element (delete the strong word from the css selector) and delete the list-style-position: inside; property.
  • Also I recommend you not to use px unit on font related propertie as it is not accessible. Visually impaired people use their browser with large font settings, and px units do not adjust to this browser setting. Have a look at rem and em units. Use px units only on border-radius, box-shadow and such properties as their visual do not effect readability.

  Keep up the good work!

  Marked as helpful

  0
• 

  P

  Thomas Dimnet•250

  @tdimnetPosted 7 months ago

  Hi Hannibal,

  Great work with your recipe project. Your project seems to meet the requirements. However, I have a weird issue with my computer: it seems that the website is really tinny.

  For example, some of the font size you used are:

  font-size: 9px;
  

  I think it's a little bit too small and it should be a bit bigger. On my challenge, mine is 16 pixels. You can have a look here: https://tdimnet.github.io/Recipe-page/ I don't say that my solution is better than yours, I just think your project could be a bit bigger.

  Let me know, Tom.

  0

  ---

  

  Rupak Mukherjee•970

  @hannibal1631Posted 7 months ago

  @tdimnet I'm facing that exact problem. The webpage seems too small compared to the actual solution. I increased the font sizes of all heading and other contents. But still the height of the container remains same. It's not long like the actual page. Can you suggest anything on that? Should I change anything on body and container?

  0

  

  P

  Thomas Dimnet•250

  @tdimnetPosted 7 months ago

  @hannibal1631 : hi, it seems you updated your project. I am not facing issues.

  What did you do?

  Have a nice day, Tom.

  0

  

  Rupak Mukherjee•970

  @hannibal1631Posted 7 months ago

  @tdimnet : hello there. all i did was opened the preview image on my chrome and then i realized my font sizes were small as well as the margins. so i increased them by 20% ig, and it worked. Still i have a blank space at the bottom. As i'm still like 1 month into html and css, i'll figure it out in near future.thanks for checking on me though, i appreciate it mate.

  0