All comments

• 

  NKEMBOH ISAIAH•50

  @Isaiah-0914Submitted about 2 years ago

  Please I worry. When I run my project locally it's cool but when I view it from the live site I hosted on GitHub it shows the mobile version(on a laptop). As you can realize the display from my screenshot is different from how it is displayed on the live site. I don't understand why please help me out!

  

  Product Preview card component

  3

  20
  

  Uday Kumar•80

  @UK0724Posted about 2 years ago

  Hi @Isaiah-0914 👋, good job completing this challenge.

  • I have looked into your code, You have used margin "200px auto"

  .box {
      display: flex;
      width: 40%;
      /* max-width: 500px; */
      margin: 200px auto;
      /* border: 2px solid; */
      border-radius: 15px;
      /* overflow: hidden; */
      /* height: 50%; */
      background-color: white;
  }    
  

  • insted of using margin you can use flex propertIies. since you already used it.

    .box{
          display:flex;
          justify-content:center;
         align-items:center;
  }
  

  the above code will center the box

  I hope those tips will help you.

  Good job, and happy coding!

  0