Codepen has the issue of not allowing images to be hosted without paying for the “pro” tier. This is why it shows your alt-text instead. This makes it harder to debug since there isn’t an image to work with, since we can’t directly see or play around with the image itself. Technically you could just provide a url to an image hosted elsewhere, but this is frowned upon as you use up external servers to load the image.
No matter how good someone is, looking at just the code and knowing 100% of how its going to work without actually seeing and testing it generally never happens. Having a reproduction/playground always helps. Its very hard to take in 100% of some code and know exactly how it works without actually messing with it. This is especially true when it doesn’t work, as there are infinite ways to screw something up haha. Since codepen doesn’t provide the best environment to host+play around with this code in this situation, its a little tougher to provide adequate feedback on how to do something.
So at this point you might be going “how the hell do I do it then?” and I’d say just follow a guide/tutorial.
However, as said above these are essentially “the answer” to how to do what your doing. I did find these all with a quick google for what your asking about so you can see it as part of the “read, search” flow of learning in freeCodeCamp.
or look to the past for people who have asked the same question:
Some of these might be not exactly what you want, but hopefully its similar enough to what you want/need to help ya out some. Regardless, from what it sounds like your doing I think you can figure it out with some trial error, and maybe even extra googling. 
Finally, I’d like to say the best teacher isn’t others, its failure. Failure will force you to figure something out. How you figure it out is what experience is made of. You can always ask for help when you hit a wall, and potentially figure it out that way, or you can figure it out thru other means. Regardless, you have to figure it out, and the more “failures” you hit and the more ways you get out of it is how experience is built, and how you learn.
Simply put your gonna have problems… a lot of problems. Building the best flow of getting “unstuck” is key to development. If your flow starts with asking for help, you might not get much done very fast since your waiting on others to help you get answers. At the same time if you never ask for help, you might be deep in the rabbit hole learning all about the wrong things. The key is balance and using the right resources for the right things. Luckily the internet means you have essentially all the answers you can ever need, you just need to understand your problem and find those answers. (google-fu)
Good luck, keep building, keep learning, keep struggling 