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

Sj

@SJ-74India120 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

  • Mobile first using CSS


    Sj•120
    Submitted about 1 year ago

    0 comments
  • Mobile first using CSS flexbox

    #bem#sass/scss

    Sj•120
    Submitted over 3 years ago

    Would appreciate feedback on use of SCSS.


    3 comments
  • Mobile first page using flexbox

    #vanilla-extract

    Sj•120
    Submitted over 3 years ago

    1 comment
  • Mobile first flexbox solution


    Sj•120
    Submitted over 3 years ago

    0 comments
  • Mobile first 'Single landing page' using flexbox again


    Sj•120
    Submitted over 3 years ago

    0 comments
  • Mobile first price page using flexbox.


    Sj•120
    Submitted over 3 years ago

    1 comment
View more solutions

Latest comments

  • TheAashay•210
    @TheAashay
    Submitted about 1 year ago
    What are you most proud of, and what would you do differently next time?

    Using the concepts that I learnt in previous projects and completing this project faster.

    Blog preview card using CSS flexbox property

    2
    Sj•120
    @SJ-74
    Posted about 1 year ago

    Well done on your challenge. Regarding your CSS. I'd like to point out a couple of things.

    1. Using max-height should be avoided as much as you can.
    2. px can be used to replace shadow length and padding can be set using ems.
  • Bayu•40
    @DuloeW
    Submitted about 1 year ago

    Responsive QR code component, html & css

    1
    Sj•120
    @SJ-74
    Posted about 1 year ago

    Great job on completing the challenge. Few things I want to point out:

    • The background color of body is different compared to the design. (Color codes are provided in style-guide.md file).
    • Giving some shadow to the card.
    • Padding inside the card is more compared to the design.
    • Instead of the generic div tag, try using semantic html tags.
    • Avoid giving a fixed height and width. You should use max-width and calc for such operations.
    • Should use relative units instead of px for size.
  • Mohamed Essam•440
    @moessam322
    Submitted over 3 years ago

    Four Card Feature Section

    1
    Sj•120
    @SJ-74
    Posted over 3 years ago

    Greetings,

    I'd suggest a few updates/changes.

    • Your .project is wrapping all the content inside. So, instead of giving it a 'width:1440px` you should have left it because on screen-size larger than 1440 the background-color kinda changes at the ends (changes to white).
    • For some reason the heading text (your h1) is not visible on my screen.
    • Also, I'd suggest going mobile first flow(though it's totally up to you) because you don't have to write as much media query. It reduces most of your work. So, instead of changing everything, you just have to change a few things.
    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

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