3 card column preview component built with flex and grid

Community feedback

• 

  harpreet-singh-147•240

  @harpreet-singh-147Posted 11 months ago

  body{
      min-height:100vh;
      display:flex;
      flex-direction:column;
      align-items:center;
      position: relative;
  }
  

  footer {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    font-size: 11px;
    text-align: center;
    width: 100%;
  }
  

  You need to position the footer relative to the body. On the body tag, there is position relative, and on the footer, there is position absolute. Bottom: 20px or whatever value you want will place it where you want it. left: 50%; transform: translateX(-50%); will position the footer in the center of the page. You can use vanilla CSS for anything you want to. Learn how to use vanilla css first, then you can use other tools such as tailwind css and the others.

  Marked as helpful

  0