Advice Generator App Main

Community feedback

• 

  Ahmed Bayoumi•6,740

  @Bayoumi-devPosted over 2 years ago

  Hey Bence,

  • To position the dice in the middle of the div half at the bottom:

  .container {
      //...
      min-height: 200px;  /*Set the height of the box as you want*/
  }
  
  #adviceBtn {
      //...
     /* transform: translateY(80%); */    <------ Remove
     /* margin: 0 auto;  */               <------ Remove
  
      position: absolute;
      bottom: 0;
      left: 50%;
      transform: translate(-50%, 50%)
  }
  
  

  • You have some accessibility issues that need to fix.

  1.Buttons must have discernible text, Set the attribute aria-label to describe the button.

  <button id = "adviceBtn"" aria-label="Advice generator">
     //...
  </button>
  

  2.All page content should be contained by landmarks, Contain the attribution with <footer>.

  <footer>
     <div class="attribution">
        //...
     </div>
  </footer>
  

  3.Page should contain a level-one heading, Change <header> to h1 You should always have one h1 per page of the document.

  <h1id = "adviceNumEl">Advice # </h1>
  

  I hope this is helpful to you... Keep coding👍

  Marked as helpful

  0

  ---

  

  Bence Zámbó•510

  @zambobencePosted over 2 years ago

  Dear Ahmed, Thank you very much for your valuable feedback, I will use them in my future projects as well. I have managed to correct this project. :)

  Best regards Bence

  0