My Solution

Community feedback

• 

  Maksudur Rahman•50

  @SparrowHawkEyePosted over 1 year ago

  In the Live link the image is not showing.

  In the img src you used "/images/image-qr-code.png". Instead use this and it will work fine "./images/image-qr-code.png" 😊

  Corrected code will be like this:

  <img src="./images/image-qr-code.png" alt=""> 😊

  Always give alt attribute for image some value.

  2
• 

  Hassia Issah•50,650

  @HassiaiPosted over 1 year ago

  Replace <article> with the main tag and <div class="attribution"> with the footer tag to make the page accessible. click here for more on web-accessibility and semantic html

  To center the article on the page using flexbox, replace the height in the body with min-height: 100vh.

  For a responsive content,

  • Give the article a fixed max-width value, a padding value for all the sides max-width: 320px which is 20rem/em padding:16px which is 1rem/em, a background-color of white and a border-radius value, the rest are not needed.
  • Give the img a max-width of 100% and a border-radius value, the rest are not needed.

  Give .text a margin value for all the sides and text-align: center. Give p a margin-top or h1 a margin-bottom value for the space between the text.

  Use relative units like rem or em as unit for the padding, margin and width values . For more on CSS units Click here and here

  Hope am helpful.

  Well done for completing this challenge. HAPPY CODING

  1