Here it is. I did this a while ago but never got around to completing it, my only issue with it is I have white space at the top and bottom when the main container fills up the width of the page at lower screen sizes. I partially solved it by changing the
relative but I’m not sure what’s going on.
Thank you for any feedback, Luke
Learn to use the developer tools. Click on a div and the styles panel is scrollable for quite a ways. The styles panel is a summary of the effect of all applied styles. Chrome, my user agent , applied a
margin: 8px; but top and bottom space was greater. However, when I applied a reset stylesheet (located in the codepen settings panel under CSS) the entire gap went away.