Skip to content
OverviewSolutions
8
Comments
4
Parvez785
@Parvez785

All comments

  • Abdul Azeez•70
    @Aazeez257Submitted over 1 year ago

    how do I align this card vertically centered, Somehow I centered it using vh25, but Im not sure its the correct way of doing it, Kindly help me with this, Thank you

    qr component with html and css

    1
    Parvez785•180
    @Parvez785Posted over 1 year ago

    To center the card vertically Use below properties on body or container you are using

    display: flex
justify-content:center;
align-items:center;
height:100vh
    2
  • Parvez785•180
    @Parvez785Posted over 1 year ago

    Instead of using margin-top and bottom on body.container use below code

    display: flex;
justify-content: center;
align-items: center;
height: 100vh;
    Marked as helpful
    0
  • Ahmedkh24•20
    @Ahmedkh24Submitted over 1 year ago

    Hello, folks!

    This is my second HTML/CSS project and it's about building a card component, and I learned a lot of new CSS properties in this project such as "max-width", "text-decoration", "over-flow", "box-shadow", "transition" and some Pseudo classes such as ": hover, active, link, visited ". So, please give it a look and I wish to get feedback on it and what could be done better.

    Thanks in advance!

    Making Order Summary Card component using HTML5/CSS3

    2
    Parvez785•180
    @Parvez785Posted over 1 year ago

    Hey, there congrats on completing challenge,the image is not properly positioned use /background-size: contain;/ to match background image position also u have not used background-color for body as below background-color: hsl(225, 100%, 94%); make above changes to match the design

    Happy coding ! and great work done

    Marked as helpful
    0
  • fernandojeffe•50
    @fernandojeffeSubmitted over 1 year ago

    I don't know why but I couldn't use the second font it didn't recognize Family: [Fraunces]

    css grid

    2
    Parvez785•180
    @Parvez785Posted over 1 year ago

    Hey, there congrats on completing challenge , You can try adding font fraunces in HTML markup in head.

    <link rel="preconnect" href="https://fonts.googleapis.com"> <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin> <link href="https://fonts.googleapis.com/css2?family=Fraunces:wght@500&display=swap" rel="stylesheet">

    Also you design is not responsive for mobile version, and remove black border displaying around button.

    Let me know if this was helpful

    Marked as helpful
    0