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

ahmed4234

@ahmed423440 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

  • quick not in detail recipe

    #tailwind-css

    ahmed4234•40
    Submitted 5 months ago

    1 comment
  • social link profile


    ahmed4234•40
    Submitted 5 months ago

    1 comment
  • blog card with tailwindcss

    #tailwind-css

    ahmed4234•40
    Submitted 5 months ago

    1 comment
  • Qrcard with tailwind css

    #tailwind-css

    ahmed4234•40
    Submitted 5 months ago

    1 comment

Latest comments

  • Артем Головко•80
    @ArtemGolovko
    Submitted 5 months ago
    What challenges did you encounter, and how did you overcome them?

    I couldn't get it pixel perfect.

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

    How to get it to match the design more closely

    Responsive recipe page built with tailwindcss

    #tailwind-css
    1
    ahmed4234•40
    @ahmed4234
    Posted 5 months ago

    great job, your solution is close to the design

  • P
    Andrew A Lee•380
    @drewlee
    Submitted 5 months ago
    What are you most proud of, and what would you do differently next time?

    I built this solution fairly quickly and true to the design without having access to the Figma file. I don't think I would do anything different for handling this simple feature.

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

    I was exploring whether it's possible to reduce the profile's top and bottom padding for mobile without resorting to media queries. I got this working using clamp with vh units, but the viewport had to be fairly high to force the padding to its maximum size. Ultimately, I resorted to a combination of media queries and a very subtle transition effect to smooth out the transition between the mobile and desktop layouts.

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

    Making sure I'm following best practices and using modern frontend web development conventions.

    Social Links Profile

    1
    ahmed4234•40
    @ahmed4234
    Posted 5 months ago

    great work, close to the design

  • Rahul Chaurasiya•30
    @irahulchaurasiya
    Submitted 5 months ago

    Responsive Blog Preview Card

    #react#vite#tailwind-css
    1
    ahmed4234•40
    @ahmed4234
    Posted 5 months ago

    good job keep practising and you will improve

  • Nikhil Sundaraneedi•10
    @Nikhil-coder390
    Submitted 6 months ago
    What are you most proud of, and what would you do differently next time?

    I am most proud of successfully implementing a clean and responsive design using Tailwind CSS. Ensuring the QR code component was centered properly and achieving a visually appealing layout with precise spacing and typography was a great learning experience.

    Next time, I would focus on:

    • Enhancing accessibility by adding ARIA labels and improving color contrast.
    • Experimenting with animations to make the UI more engaging.
    • Exploring alternative styling approaches, such as CSS Grid or utility classes, to refine layout flexibility.
    What challenges did you encounter, and how did you overcome them?

    One of the main challenges I faced was centering the QR code component perfectly on the page while ensuring proper spacing between elements. Initially, I struggled with extra space between the image and text, but I resolved it by adjusting margin, padding, and flex properties in Tailwind CSS.

    Another challenge was fine-tuning typography and spacing, especially combining letter-spacing and line-height while keeping the design visually balanced. I overcame this by experimenting with Tailwind’s text and spacing utilities, making small adjustments until I achieved the desired look.

    I also faced minor issues with vertical alignment due to h-screen, which pushed elements down unexpectedly. By restructuring my layout and removing unnecessary height properties, I ensured the card was centered properly.

    A huge thanks to ChatGPT for providing quick guidance and helping me debug layout issues efficiently! 🚀

    Qr Code Component using Tailwind CSS

    #tailwind-css
    1
    ahmed4234•40
    @ahmed4234
    Posted 5 months ago

    good job keep improving

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