Drum Machine Feedback Appreciated

Just about finished my drum machine and would love some feedback. I’ve implemented everything the example has with the exception of the time limits on the presence of text in the display. I’m not sure about the effects I have added to the pads as I have never used box-shadows before. Any feedback/criticism would be valued.

Here’s the link: https://codepen.io/sam_donaldson2018/pen/bZmvKP


1 Like

@paladinvaan2018 the “B” button is comming out of the rectangle.
I have not gotten up to this project yet but is this supposed to mobile friendly? It is not responding to the size of the screen. Other than that it looks great!

I had forgotten about responsive sizing. I don’t think that is required, but it can’t hurt.

On another matter, what do you mean by

I don’t understand what this means as I tried resizing the page but the B is always in the correct place. Could you be more specific?


I have taken a screenshot of the way I view your project. Here it is.


It is the drum and slider. I am using Firefox.

I can’t seem to replicate the error.
I’ve tried looking at the page in both Edge, Firefox and Chrome as well as in the various views CodePen offers but it works correctly in everything. Maybe the problem is specific to your device.

That is strange that it is only happening on my computer. I will investigate it more. It happens of Firefox version 66.0.4, and Firefox Developer Edition version 67.0b16. On Chromium 73 it looks okay.

I have Firefox version 66.0.4 and it works fine on that.