How do I make purple ontop of every div. Z-index is not working

Question

The green div it hides when under the gray ones how'd I make show ontop of them when I move
https://code.sololearn.com/WzJ1YO0c00ve/?ref=app

If you click start it will display but when you move it to a gray area it disappears

Answer 1

To do this, you don't need to specify the z-index anywhere.
To do this, you just need to move the frog class to the end in CSS.

The fact is that every time the code is triggered, the entire html page is updated along with the entire CSS style and it turns out that first the cell you need is painted in purple, and then, for example, in gray.😎

Answer 2

Don't worry, many novice programmers forget about what was discussed in the very first lesson, this is that all programs are compiled from top to bottom and from left to right.😎

By the way, you should familiarize yourself with React, it was just created in order to update only the necessary element, and not the entire html page, Increasing the speed of the WEB application at times.

Answer 3

Lol thanks 👍

Answer 4

Can't believe I overlooked something so simple