Skip to content
  • Unlock Pro
  • Log in with GitHub
Profile
OverviewSolutions
2
Comments
2

NG

@nguernse40 points

Software engineer and lifelong learner

Latest solutions

  • Blog Preview Card with HTML and CSS


    NG•40
    Submitted about 1 year ago

    1 comment
  • QR code component with HTML and CSS


    NG•40
    Submitted about 1 year ago

    1 comment

Latest comments

  • moniquevnn•20
    @moniquevnn
    Submitted about 1 year ago

    Blog post challenge - HTML&CSS Solution

    2
    NG•40
    @nguernse
    Posted about 1 year ago

    Good job! Visually looks good. Some suggestions:

    • You have multiple uses of the h1 tag. It's generally advised to keep it to one h1 per page. See here. Also, in the context of this project, using the h1 for the .TAG and .post-copy doesn't quite make sense here. Might opt for <span> or <div> for the .TAG and <p> for the .post-copy
    • The .container-img class could be refactored by moving the padding into the .container class. Then you could remove the div which creates an unnecessary nesting.
  • Ahmed Raza•60
    @ahmedraza032
    Submitted about 1 year ago

    QR component made using HTML and CSS

    1
    NG•40
    @nguernse
    Posted about 1 year ago

    Looks good as is. Great job!

    For future consideration, you might refactor the style.css file to utilize css variables. This would benefit in the future, if the design system changes or you add more classes with similar attributes, allowing you to edit a single variable versus everywhere the same value is being used.

    For example, working with the design system colors:

    :root {
        --color-white: hsl(0, 0%, 100%);
        --color-slate-300: hsl(212, 45%, 89%);
        --color-slate-500: hsl(216, 15%, 48%);
        --color-slate-900: hsl(218, 44%, 22%);
    }
    

    So then whenever you use the dark grey color you can do:

    p {
        color: var(--color-slate-900);
    }
    
    .text-content {
        color: var(--color-slate-900);
    }
    
    Marked as helpful

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