Skip to content
OverviewSolutions
4
Comments
4

Szeri

@Szeri32360 points

I’m a mysterious individual who has yet to fill out my bio. One thing’s for certain: I love writing front-end code!

Latest solutions

Latest comments

  • Szeri•60
    @Szeri323

    Hi @joekotvas,

    Congratulations!

    I like your solution and the challenge that you made for yourself. Keep it going!

  • Szeri•60
    @Szeri323

    Hi @VanshikaSabharwal,

    Good job, I like your solution!

    If you are wondering what you can improve in your solution:

    you could add padding on paragraps, it will look much better.

    The second thing is to center the card in the middle of the page adding min-height:100vh on the body and use for example display:flex and center it with justify-content: center and align-items : center or use display:grid and center it with place-items:center.

    I hope that it will will help.

    Happy New Year! 🥳

  • Szeri•60
    @Szeri323

    Hi @mohit-sonii,

    Nice work! I thought that I would offer you some advice.

    If you want to center your card, use display: flex along with justify-content: center and align-items: center on the body tag, and make sure it's at least 100vh. For example, set min-height: 100vh.

    You can use a CSS selector with the hover pseudo-class like this: h2:hover. It makes the heading change color when you hover over it:

    h2 {
    font-weight: 700;
}
h2:hover {
    color: [your-color-here];
}

    And some advice for optimization: You don't need to import all weights of fonts; you can choose the 2 that you use most.

    I hope this helps you.

  • Szeri•60
    @Szeri323

    Hi @Justine-5,

    Nice solution and good job!

    In response to your question, it's considered good practice to specify which properties you want to include in the transition. By default, the transition affects all properties.

    You can use something like this:

    transition: 150ms ease-in-out opacity;

    I hope this has been helpful.

    Happy New Year!

    Marked as helpful