So I spent some time trying to figure out how to align the audio player in the Relax section to the center responsively – so that no matter what size the device is, the player will always be aligned in the middle.
It took some experimenting with different CSS code to finally get it to work. I tried changing the margin, padding, and positioning. I got it to work (sorta) when I positioned it absolutely, but there was a slight problem.
The absolute positioning made the element go on top of everything else, and not in the correct flow.
I didn’t really know how to fix this, so I tried some different methods. What I had never thought of doing before was to actually search how to center the canvas element. I did that, and I find code that worked! All I had to do was display it as a block, have the margin auto and padding at 0… that’s it! Such simple code for something that took me ages to figure out. Now it’s aligned in the middle responsively!