Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Oops! You need to be logged in to do that
Not Found
Not Found
Oops! You need to be logged in to do that
Not Found
Not Found
Not Found
Oops! You need to be logged in to do that

Submitted

Memory game React

#accessibility#react
P

@delianZidarov

Desktop design screenshot for the Memory game coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
4advanced
View Challenge

Design Comparison

SolutionDesign

Report

0

Accessibility Issues

0

HTML Issues

View Report

Delian Zidarov’s questions for the community

Does anyone know how the auto screenshots are generated? I was wondering how best to setup the page in order to match the design. Any other comments or suggestions are also welcomed. Thank you

Community Feedback

loulou1994 100

@loulou1994

Posted

Ten out of ten! well-structured, readable, and reusable code. I'm speechless. Great work!

0

P
Chamu 10,960

@ChamuMutezva

Posted

Nice work indeed. Well done.

  • on mobile , it is working well. On desktop when i select the start game button, i am not able to complete the selection as for some reasons , i cannot scroll up and down. I am using firefox browser.

1


P

@delianZidarov

Posted

@ChamuMutezva Thanks for the feedback. Can you tell me at what screen size you had that issue? One possible answer is that you had the inspect screen open and that covered the buttons. The screens are positioned fixed so even if you scroll the screen would always start at the top of the viewport.

0

P

@delianZidarov

Posted

@ChamuMutezva Thanks for the feedback. Can you tell me at what screen size you had that issue? One possible answer is that you had the inspect screen open and that covered the buttons. The screens are positioned fixed so even if you scroll the screen would always start at the top of the viewport.

0

P
Chamu 10,960

@ChamuMutezva

Posted

@delianZidarov , my laptop screensize is about 1366 * 768. The issue seems to that at 700px when i inspect, but even without inspecting i still get the same results. I have dm screenshots on your slack handle

0

P
Chamu 10,960

@ChamuMutezva

Posted

Another thing that you should try, is playing the game using a keyboard only . Since the game tokens are supposed to be interactive , a div will not be accessible to keyboard users

1


P

@delianZidarov

Posted

@ChamuMutezva Thanks for all of your input and for testing things so thoroughly. The buttons should now be accessible by scrolling and tabbing through buttons works.

0

P
Chamu 10,960

@ChamuMutezva

Posted

@delianZidarov , Nice work. Keep it up

0

Please focus on giving high-quality, helpful feedback and answering any questions delianZidarov might have. Here are some key points to consider:

  • Does the solution include semantic HTML?
  • Is it accessible, and what improvements could be made?
  • Does the layout look good on a range of screen sizes?
  • Is the code well-structured, readable, and reusable?

You can read our community guidelines if you're unsure what to post.

Slack logo

Join our Slack community

Join over 100,000 people taking the challenges, talking about their code, helping each other, and chatting about all things front-end!