responsive results summary card

Community feedback

• 

  Matias Ludueña•1,990

  @matiasluduena23Posted over 1 year ago

  Hi @nina1234567896! good work! Just one advice. try to use one h1 tag in all your main content. Maybe you can use it in your "result" title. And like Mario said if your put min-height:100vh in your body, your card is goint to center. Because you have done well with display:flex; align-item; justiify... but you don't have any height so it is imposible to center the main content. Try to use a height when you want to center things

  good code!

  Marked as helpful

  2

  ---

  

  nina1234567896•280

  @nina1234567896Posted over 1 year ago

  @matiasluduena23 thankyou this was well explained! I got the trick from one of the previous comments from another project but didnt think of the importance of adding a min-height!

  1
• 

  TRES•90

  @Tre3s-bytePosted over 1 year ago

  Hi Nina,

  Overall, it is greatly done. I only have a few specific recommendations:

  • It's a good practice to add a "description" meta tag to improve visibility in search engines (SEO).
  • Consider moving the styles related to legal information to "styles.css" for better organization.
  • Reusing classes is beneficial to minimize code and improve clarity, especially in large projects when collaborating with coworkers. You may want to explore naming methodologies like BEM (Block Element Modifier) to enhance readability.

  =) I hope you find this useful!

  Marked as helpful

  1

  ---

  

  nina1234567896•280

  @nina1234567896Posted over 1 year ago

  @Tre3s-byte Thankyou! I am not sure what you mean by the second point?i will defs read about BEM. I am working on trying to write less code b grouping elements with similar styles into classes.

  0

  

  TRES•90

  @Tre3s-bytePosted over 1 year ago

  @nina1234567896 Hi there! hahaha Right, I'm sorry. I meant to say 'move attribution styles' that are still in your HTML.

  0
• 

  P

  doublem•620

  @MarioMinchevskiPosted over 1 year ago

  Hi there!

  Quick tip on how to center your class="main" in the center of the screen:

  • make the display of it's parent (in your case the body), display:grid;.
  • after that you can position the content in the center by using place-content:center;
  • if it does not center it, make sure to give the body a min-height: 100vh;

  Hope this helps, happy coding!

  Marked as helpful

  1

  ---

  

  nina1234567896•280

  @nina1234567896Posted over 1 year ago

  @MarioMinchevski i will defs try using grid next time !=) Thankyou for your advice.

  0