Order Summary Component Page

Community feedback

• 

  Adriano•38,120

  @AdrianoEscarabotePosted almost 2 years ago

  Hi Jimoh Abdulsamad, how are you? I really liked the result of your project, but I have some tips that I think you will enjoy:

  To align some content in the center of the screen, always prefer to use display: flex; it will make the layout more responsive!

  body {
      margin: 0;
      padding: 0;
      display: flex;
      align-items: center;
      flex-direction: column; // just if the body has two child
      justify-content: center;
      min-height: 100vh;
  }
  

  To prevent the background image from breaking at higher resolutions, we can prevent this in two different ways:

  1. Add a background-repeat: repeat-x;, the image will repeat on the horizontal axis, preventing it from breaking.
  2. Add a background-size: 100% 50vmin;, the 50vmin will set its height as the page target, and 100% will make it stretch on the horizontal axis.

  Feel free to choose one of the two!

  The rest is great!

  I hope it helps... 👍

  Marked as helpful

  0
• 

  Jimoh Abdulsamad•110

  @buk-ola01Posted almost 2 years ago

  Thanks a lot, I appreciate

  Noted!!

  0