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

Sarfaraz 👾

@sarfarazstarkIndia650 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!

I’m currently learning...

Html, Javascript, Css

Latest solutions

  • Multi Step Form Using vanilla js and css


    Sarfaraz 👾â€ĸ650
    Submitted about 1 month ago

    0 comments
  • Bento grid

    #tailwind-css

    Sarfaraz 👾â€ĸ650
    Submitted 9 months ago

    0 comments
  • Responsive TailwindCSS & JS Calculator App

    #tailwind-css

    Sarfaraz 👾â€ĸ650
    Submitted 10 months ago

    I would like to learn how input range style can be change cause if i know i can use it to switch theme well i did it but other javascript heavy approach


    0 comments
  • Rock Paper Scissors

    #tailwind-css

    Sarfaraz 👾â€ĸ650
    Submitted 11 months ago

    0 comments
  • Tip calculator app


    Sarfaraz 👾â€ĸ650
    Submitted 11 months ago

    0 comments
  • Fylo landing page with dark theme and features grid

    #tailwind-css

    Sarfaraz 👾â€ĸ650
    Submitted 11 months ago

    0 comments
View more solutions

Latest comments

  • Gabriela Amaroâ€ĸ20
    @GabAmarog
    Submitted about 1 year ago
    What are you most proud of, and what would you do differently next time?

    I'm proud because I thought it would take a long time (it took an afternoon) to do it because I was afraid of many things, but you learn from mistakes. What would I do differently? I think nothing, every inconvenience introduced me to a new tool to improve my knowledge

    What challenges did you encounter, and how did you overcome them?

    My biggest problem was centering it on the page, it gave me a problem that the white content was widened and not centered, what I did was use a container that had the white container and the information. Apart from this, the measurements would be exact but I did what I could and I am proud

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

    I had never made a responsive page, in terms of measurements the QR was on one side or very low but with YouTube research and help from people with greater knowledge than me it helped me. With part of receiving help, any advice helps me a lot, all advice is well received

    My first responsive QR with html and ccs

    #accessibility
    1
    Sarfaraz 👾â€ĸ650
    @sarfarazstark
    Posted 6 months ago

    You did a great job, congrats But i would suggest:

    • Using semantic tags like: main for container, h1 for title
    • Center the component using flex on body tag thats all
  • Mesroua Djamelâ€ĸ430
    @MesrouaDjamel
    Submitted 11 months ago
    What are you most proud of, and what would you do differently next time?

    now I use figma before code

    What challenges did you encounter, and how did you overcome them?

    I've never deployed the application before, but reading the documentation on vercel makes it easier.

    Responsive Qr Code with FlexBox

    #next#tailwind-css
    2
    Sarfaraz 👾â€ĸ650
    @sarfarazstark
    Posted 11 months ago

    Hello @MesrouaDjamel,

    Your solution looks great! For an even closer match to the given design, consider the following adjustments:

    1. Set the max-width of your main tag to 300px.
    2. Add 0.75rem left and right padding to your p tag.

    These changes will help your solution align more closely with the provided design.

    Best regards, Sarfaraz

    Marked as helpful
  • amiralamf4â€ĸ90
    @amiralamf4
    Submitted 11 months ago

    social media link card using flex in easy way with responsive(375x592)

    1
    Sarfaraz 👾â€ĸ650
    @sarfarazstark
    Posted 11 months ago

    Solution

    set the body and main div height to auto

    add body padding top and bottom to 2rem

    add gap of 10px to socialmedia tag

    Marked as helpful
  • amiralamf4â€ĸ90
    @amiralamf4
    Submitted 11 months ago

    Stats preview card component | responsive using flex and simple CSS

    #accessibility#angular
    1
    Sarfaraz 👾â€ĸ650
    @sarfarazstark
    Posted 11 months ago

    The issue is with your width and height dont set explicit height and width also always use max-width for this kind of component

    for now use this solution:

    max-width: 870px;

    max-height: 350px;

    Marked as helpful
  • Rabin Thamiâ€ĸ20
    @rabin-thami
    Submitted over 1 year ago

    Responsive QR Component using HTML and CSS

    1
    Sarfaraz 👾â€ĸ650
    @sarfarazstark
    Posted over 1 year ago

    Use color from style-guide.md for text

  • Moussaâ€ĸ540
    @Mahmoud974
    Submitted over 1 year ago

    Multi form

    #accessibility#react#typescript#tailwind-css
    1
    Sarfaraz 👾â€ĸ650
    @sarfarazstark
    Posted over 1 year ago

    In the input field add some paddings

    Even though I filled in all those input fields your code still shows an error try Debug this

    I think you validating the field using the input event use click event to check input fields

View more comments
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

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