Stats preview card, problem with the image width !

Community feedback

• 

  Hassan Moataz•1,860

  @hassanmoaaPosted 9 months ago

  • set a max-width for the parent element <header> or you can remove the header tag and put the overlay in the <picture> tag and also set a max-width on it so you dont have many parents for a specific element, that may fix the problem.

  For the id's and classes:

  • You want to use classes over ids because ids are harder to maintain and can only be used once and also you don't have JS in here so prob you won't need id's as much.

  • And it's not about using them alot it's about to maintain your code readability for yourself/reviewer or your team if someone will take the project after you, so you should choose a meaningful name for them and use them when needed so the code is easy to read and maintain.

  • You can try and choose a CSS approach like BEM or OOCSS.

  Other than that you did good, keep up the work!

  0
• 

  Guerinik Abderrahmane•480

  @AbderrahmaneGuerinikPosted 9 months ago

  Hey @Ynotlocin1! For the image issue try : width: 100%.

  for your question about class and id , usually for styling developers use classes, id's are often used with JS.

  0
• 

  Steve•1,170

  @peanutbutterjllyPosted 9 months ago

  I can't recommend styling based on #id's, they're WAY too specific and can be a pain to override on bigger apps/sites.

  Regarding classes, it depends on what your teams preference is - if you're coding solo, do what you like best.

  0