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

Mohammed Zakaria Khan

@zaks276South Africa180 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

  • Responsive Interactive Card Details Form Using CSS Grid And Flexbox


    Mohammed Zakaria Khan•180
    Submitted almost 3 years ago

    0 comments
  • Responsive Tip Calculator App


    Mohammed Zakaria Khan•180
    Submitted almost 3 years ago

    0 comments
  • Responsive Expenses Chart Component Using Chart.js

    #chart-js

    Mohammed Zakaria Khan•180
    Submitted almost 3 years ago

    0 comments
  • Responsive Advice Generator App

    #accessibility

    Mohammed Zakaria Khan•180
    Submitted almost 3 years ago

    1 comment
  • Responsive Interactive Rating Component With Animation


    Mohammed Zakaria Khan•180
    Submitted almost 3 years ago

    0 comments
  • NFT preview card using CSS Flexbox


    Mohammed Zakaria Khan•180
    Submitted almost 3 years ago

    1 comment
View more solutions

Latest comments

  • Federico•80
    @02fede02
    Submitted almost 3 years ago

    Made it with tailwindcss

    #tailwind-css
    1
    Mohammed Zakaria Khan•180
    @zaks276
    Posted almost 3 years ago

    Hello Federico. Great job on the solution. It looks amazing.

    To answer your question, both methods are fine however in my experience the image tends to load more slowly when you do the render in Javascript instead of hiding the HTML and then displaying it via Javascript. Generally too much Javascript tends to slow down websites.

    Hope this was helpful.

    Marked as helpful
  • Luka Simic•10
    @Cv1CC1
    Submitted almost 3 years ago

    Interactive rating component

    1
    Mohammed Zakaria Khan•180
    @zaks276
    Posted almost 3 years ago

    Hello Luka.

    • You forgot to set the cursor to pointer when hovering over the buttons. Just set the cursor: pointer wherever you have the :hover CSS psuedo-class.
    • Also you can use the defer attribute in your script tag so you can put it in the <head> tag instead of at the bottom of the <body> tag.

    Other than that, great job. Your solution looks great. I hope this was helpful

    Marked as helpful
  • Amit Kumar•100
    @amit-kumar-18
    Submitted almost 3 years ago

    Interactive Rating Component

    2
    Mohammed Zakaria Khan•180
    @zaks276
    Posted almost 3 years ago

    Hello Amit. Good job on the solution. I like the little animation. Its a nice touch.

    • To remove the border on the submit button use border: none; in your CSS.
    • As for the slow loading image, I believe it is due to rendering the thank you window via Javascript. I've noticed the same effect with other solutions that used this method.

    I hope this was helpful.

  • Dennis Griffin•1,320
    @dgdev1024
    Submitted almost 3 years ago

    Product Preview Card Component - HTML / CSS

    1
    Mohammed Zakaria Khan•180
    @zaks276
    Posted almost 3 years ago

    Hello Dennis.

    Good work on the solution it looks great. However it is a little big compared to the original design. I recommend using Greenshot to get the measurements for the component so the solution can be as close to the design as possible.

    I hope this was helpful

  • P
    Ed•720
    @EdwinSch
    Submitted almost 3 years ago

    Rating component with CSS and JavaScript

    1
    Mohammed Zakaria Khan•180
    @zaks276
    Posted almost 3 years ago

    Hello Ed. Good job on the design, your solution looks great. I have some tips for you, you should consider using tags such as <main> or <article> etc instead of only <div>. Also you can use the defer attribute in your script tag so you can put it in the <head> instead of at the bottom of the <body> tag. I hope this was helpful.

    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

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