CSS flexbox

Community feedback

• 

  バレンタイン 😈•64,170

  @VCaramesPosted almost 2 years ago

  Hey there! 👋 Here are some suggestions to help improve your code:

  • The “car images/icons” in this component are purely decorative; They add no value. So their Alt Tag should be left blank and have an aria-hidden=“true” to hide them from assistive technology.

  More Info:📚

  https://www.w3.org/WAI/tutorials/images/

  • The headings in your component are being used incorrectly. Since the h1 heading can only be used once, it is always given to the heading with the highest level of importance. This component has three headings of equal importance, so the best option would be to use an h2 heading since it is reusable and it will give each heading the same level of importance.

  If you have any questions or need further clarification, feel free to reach out to me.

  Happy Coding!🎄🎁

  Marked as helpful

  0

  ---

  

  Mariana Rainha•50

  @marianarainhaPosted almost 2 years ago

  @vcarames thank you very much for your feedback ! I’ll make all those improvements.

  0

  

  バレンタイン 😈•64,170

  @VCaramesPosted almost 2 years ago

  @marianarainha

  I am glad that I was able to help out!

  Keep it up!

  0
• 

  david william•120

  @ksroguePosted almost 2 years ago

  Hello, on my project I used border-radius in my main cards div with a 'overflow: hidden;'.

  I think you can use 'border-top-left/right-radius' on the first card and border-bottom-left/right-radius' on the last card too

  Marked as helpful

  0

  ---

  

  Mariana Rainha•50

  @marianarainhaPosted almost 2 years ago

  @ksrogue thank you, i'll take a look

  0
• Account deleted

  /* How can I set different borders radius when the cards are wrapped so it can look like the mobile-design ? Should I use @media ? How ? *
  You can use the clamp function on css checkout from mdn or use the responsive parameters like vw for border-radius value

  Marked as helpful

  0

  ---

  

  Mariana Rainha•50

  @marianarainhaPosted almost 2 years ago

  @GorkemEldeniz Thank you, i'll check it out !

  1
• 

  Sinisa Vukmirovic•1,690

  @SinisaVukmirovicPosted almost 2 years ago

  Hello!

  Hey, border is, actually, a shorthand way of declaring it. Border radius can, actually, take in 4 values. A different one for each corner if you want.

  border-top-left-radius
  border-top-right-radius
  border-bottom-right-radius
  border-bottom-left-radius
  
  or shorter
  
  /* top-left | top-right | bottom-right | bottom-left */
  border-radius: 1px 0 3px 4px;
  

  Here, check it out in the documentation

  Hope this helps!

  0

  ---

  

  Mariana Rainha•50

  @marianarainhaPosted almost 2 years ago

  @SinisaVukmirovic Thank you for your answer but the question is how to make it responsive so it changes when the cards are wrapped.

  0

  

  Sinisa Vukmirovic•1,690

  @SinisaVukmirovicPosted almost 2 years ago

  @marianarainha

  You would set one value combination for mobile view, and another value combination for desktop view in media queries.

  Marked as helpful

  0

  

  Mariana Rainha•50

  @marianarainhaPosted almost 2 years ago

  @SinisaVukmirovic thank you very much, now it works :)

  0