Responsive using flex

Community feedback

• 

  バレンタイン 😈•64,170

  @VCaramesPosted almost 2 years ago

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

  • It is best practice ✅ to use, classes for styling purposes, while using ids solely for JavaScript.

  • Along with the blank alt tag, you also want to include the aria-hidden=“true” ⚠️ to your “ images/illustrations” to fully remove them from assistive technology.

  More Info: 📚

  [MDN Aria-Hidden] (https://developer.mozilla.org/en-US/docs/Web/Accessibility/ARIA/Attributes/aria-hidden#description)

  • To ensure that the "rating buttons" are fully accessible 💯, they need to be built using a form ⚠️.

  1. Everything will be wrapped inside a fieldset which will have a legend that is visually hidden using CSS.
  2. Inside, there should be five input radios and each input should have a label attached to it to make the “ratings” accessible.
  3. The last thing you will want to include will be a button so users can submit their choice.

  More Info: 📚

  MDN: <input type="radio">

  MDN: Field Set Element

  • It is best practice ✅ to have separate files for you coding files (HTML, CSS, JS). It helps keep things organized and make it easier to maintain.

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

  Happy Coding! 🎆🎊🪅

  Marked as helpful

  0
• 

  Nelson•2,390

  @nelsonleonePosted almost 2 years ago

  HELLO......congrats on completing this challenge....well done:🎊 🎊

  You can remove the border on the buttons when there are clicked by setting

  button:focus{
    border:none;
    outline:none;
  }
  
  

  Hope this comment was helpful. Have fun coding

  0

  ---

  

  Tanasead Rattanapan•100

  @tnzgxPosted almost 2 years ago

  @nelsonleone thank you, but it still the same.

  0

  

  Nelson•2,390

  @nelsonleonePosted almost 2 years ago

  @tnzgx add !important.

  button:focus{
    border:none  !important; 
  }
  

  make sure you push to your repo so it takes effect

  0