QR Challenge with HTML & CSS

Community feedback

• 

  AnthMan•190

  @AnthvirusPosted over 1 year ago

  Remove these codes: -ms-transform: translateY(-50%); transform: translateY(-50%); margin: auto; top: 50%;

  Then, go to the body: add these codes: max-width: 100vw; min-height: 100vh; display: flex; justify-content: center; align-items: center;

  That's it. Your code is great and I love your styling. Happy coding ;)

  Marked as helpful

  1

  ---

  

  Beni Rodríguez•30

  @BRod79Posted over 1 year ago

  @Anthvirus Thanks. Did what you recommended and it worked! Now I’m out of screenshot generation, so can’t see it here, but it works :)

  *Also obviously I notice the background color is different, but I used the colors on the style-guide file. I’ll change that at a later date, no big deal. I will also put the faint shadow the box have, as I’ve noticed it :P

  0

  

  AnthMan•190

  @AnthvirusPosted over 1 year ago

  For the background, swap the background color with the color of your text. Not the header text @BRod79

  Marked as helpful

  0

  

  Beni Rodríguez•30

  @BRod79Posted over 1 year ago

  @Anthvirus hah.. didn’t realize I put the colors in the wrong place... definitely, I was thinking that my text was a bit too light to be legible :P (and the bg too dark!) :P

  Thanks again!

  0