Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
5
Comments
4
Jessica
@JesNetWD

All comments

  • Kadhir•90
    @kadhirshankar
    Submitted 2 months ago
    What are you most proud of, and what would you do differently next time?

    I'm most proud of how clean and close to the design I was able to make the layout. Next time, I’d focus more on responsiveness from the beginning.

    What specific areas of your project would you like help with?

    Improving responsive layout and best practices for structuring CSS more efficiently.

    Recipe Page

    1
    Jessica•70
    @JesNetWD
    Posted 2 months ago

    Your solution is very good. I see no problems with the code. Although the color is different from the design.

  • Diego Torres Añorga•30
    @D1tor7
    Submitted 3 months ago

    Responsive Social Links Profile

    1
    Jessica•70
    @JesNetWD
    Posted 3 months ago

    Your code looks good. But you should change the color of your button when its set to hover.

    button:hover {
      background-color: hsl(75, 94%, 57%);
    }
    

    You could also change the color of the attribution, It's not easy to see it against the background-color.

    .attribution {
    color: hsl(0, 0%, 100%);
    }
    
  • Nwa-Njoku•20
    @Nwa-Njoku
    Submitted 3 months ago

    Blog card review page

    2
    Jessica•70
    @JesNetWD
    Posted 3 months ago

    You set align-items and justify-content property in the body when you did not set display to flex. It won't center properly that way, which is why you then needed to add padding: 40px 20px; and margin: 0 auto; to center it. Set display to flex, then remove the padding property. Set margin to 0.

    body{
      margin: 0;
      background-color: rgb(244, 208, 78);
      max-width: 1440px;
      max-height: 100%;
      display: flex;
      align-items: center;
      justify-content: center;
    }
    

    The same goes for the .container rule. Set display to flex, remove the margin and give it a uniform padding all around. You do not need to set align-items.

    .container{
      padding: 20px;
      justify-content: center;
      background-color: white;
      height: 550px;
      width: 400px;
      border-radius: 16px;
      box-shadow: 5px 5px 0 rgba(0, 0, 0, 1);
      border-color: black;
      border-style: solid;
      border-width: 1px;
    }
    
  • Nguyen Hong Anh•20
    @NguyenHongAnhS3924711
    Submitted 3 months ago

    QR-Code

    1
    Jessica•70
    @JesNetWD
    Posted 3 months ago

    It's very good but it's different from the given design. When viewed on a different screen the page is still accessible, but the horizontal margins are reduced making it much less attractive. The code is very well written, it's structured and readable.

    Marked as helpful
Frontend Mentor logo

Stay up to datewith new challenges, featured solutions, selected articles, and our latest news

Frontend Mentor

  • Unlock Pro
  • Contact us
  • FAQs
  • Become a partner

Explore

  • Learning paths
  • Challenges
  • Solutions
  • Articles

Community

  • Discord
  • Guidelines

For companies

  • Hire developers
  • Train developers
© Frontend Mentor 2019 - 2025
  • Terms
  • Cookie Policy
  • Privacy Policy
  • License

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub

Oops! 😬

You need to be logged in before you can do that.

Log in with GitHub