QR Card with Flexbox

Community feedback

• 

  Bader Idris•2,880

  @Bader-IdrisPosted over 1 year ago

  You can set the container in the middle of the screen whatever user changes it when you add these properties to it in CSS:

  .container {
    display: absolute;
    top:50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
  

  the new feature is transform, it has many lovely properties you can discover, I personally love it. Hope it's useful

  Marked as helpful

  0

  ---

  

  Saul Aranguiz•10

  @saranguiz92Posted over 1 year ago

  Thank you very much for your feedback! @Bader-Idris

  1
• 

  Talisson•190

  @talissoncostaPosted over 1 year ago

  Hey @saranguiz92, congrats for your solution.

  I've got some tips to you..

  1. Try to apply css to each class individually... even if you are duplicating some props it is gonna be better because it is gonna be explicit to you and later on you can figure out how to handle it.. now you are grouping too much and many of styles are being overwritten.

  2. As you are already using flexbox you can use gap here instead of a <br>

  Anyway, that is a great start, soon you are getting used to flexbox and you will see how helpful it is.

  I hope it helps... Happy coding

  Marked as helpful

  0

  ---

  

  Saul Aranguiz•10

  @saranguiz92Posted over 1 year ago

  Thank you very much for your feedback! @talissoncosta

  0