Trying to do something strange here for a blog type site. Site will be horizontal scrolling. Also looking to make it mobile responsive.
What I am trying to do is make it so each blog post (title,text,images) 100% height, auto width. I want my content to fill up the height of the viewport, and then overflowing content will begin a new column until it all fits within the chunk of the post which then scrolls horizontal.
I have been reading today about css implementation of columns and I believe I am probably going to need some JS to get this to work the way I want it to, but not really sure where to start as JS isn’t really my forte.
I am attaching a basic photo to demonstrate what I mean. I believe the solution may be something along the line of getting the viewport height, applying that to the post height, setting the column to 100%, calculating how much content can fit into that column and then dynamically creating and filling content boxes as needed. Somewhat hard to explain so look at the photo.
Photo.
Would love to hear any suggestions, thanks!
