How to make unordered lists like example Tribute page

Hi there,

I am wondering how I can center and align my lists just like the example tribute page:

https://codepen.io/freeCodeCamp/full/zNqgVx

Here is my own page, where you can see the problem (@ John Mayer’s top 3 albums section):

https://codepen.io/Nanneparty/pen/dLdJry

I tried to do the same as the example page but my text and bullets are just all over the place. Which I don’t understand, because I do the same as in the example page.

Well I used some code from stack overflow, which helped me a bit:

ul {display: inline-block;
text-align: left;}

but still, the h3 heading (John Mayer’s top 3 albums) is still a bit too much to the right in my opinion. So adding this code feels more like a quick fix rather than actually having a fundamental solution (like in the example tribute page).