I’m happy things are starting to make sense, but would like some help with my Pen :
what is the best method for me to center the quoteContainer div within the imageContainer div?
It’s centered horizontally but not sure how to do it vertically. Have put a margin-top value on the child container to get around the problem but it’s not very aesthetic.
my codepen seems to have problem loading the initial background image, maybe I’m not seeing the problem because it’s 3 a.m but it keeps loading a “couldn’t find…” image instead of the moon image I selected.
I wanted for the background image to change every time I click on it, but I seem to only be able to do that once I use the getQuote button. I have a feeling the problem is going to be obvious in the morning, but posting it anyway…
I have a solution for these two. The first one is just a matter of moving the call to getImage from right after getQuote to inside the getJSON callback function at the end. The second problem is caused by the fact the browser is caching the url which is the same until you click the Get Quote button again. All you need to do is add an extra parameter with a random number to the unsplashURL query string like: