QR Code using basic CSS custom properties

Community feedback

• 

  Daniel 🛸•44,270

  @danielmrz-devPosted 11 months ago

  Hello @Rachelpizane!

  Your project looks great!

  Here are two ways to place the card in the middle of the page:

  • You can apply this to the body (in order to work properly, you can't use position or margins):

  body {
      min-height: 100vh;
      display: flex;
      justify-content: center;
      align-items: center;
  }
  

  • You can also apply this to the element you wanna center (works well with projects with only one centered element, like this one):

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

  I hope it helps!

  Other than that, you did an excelent job!

  Marked as helpful

  1

  ---

  

  Rachel Pizane•60

  @rachelpizanePosted 11 months ago

  Thanks @danielmrz-dev ! It helped a lot. I was wondering if changing the body's display was some kind of trick I was doing. 😂 Good to know I can do this.

  1