QRCode using HTML & CSS

Community feedback

• 

  Miran Legin•680

  @miranleginPosted about 2 years ago

  Hi Dylan,

  first of all congratulations on completing your first challenge. Now let's dive to code and see what can be done better.

  On a visual note it looks quite good but regarding code some things can be made better.

  1. i would suggest getting rid of most if not all the heights in css, they are really of no good use
  2. <div class="qr-container"> can be removed, instead you can use padding on the parent element <div class="main-container"> to make some room for child elements
  3. you have used border radius on at least two elements but their values are different (4% and 5%), i would suggest using another unit instead of % because it will be easier to predict the outcome
  4. regarding centering text you can use text-align: center; on parent element instead of h1 and p, it's not a problem when there are couple of elements but if there were 10+ elements inside the div it wouldn't make any sense to style them all
  5. if you're using <div class="attribution> you can set position: fixed; bottom: 0; on it just to avoid it to mess the vertical centering and be more consistent with design comparison

  Hope that helps!

  Keep coding!

  Marked as helpful

  0