I'm trying to create a horizontal scrolling site of variable width using Wordpress & am having trouble figuring out how to get it to work. Basically, I want to page to continue to expand horizontally as new posts are created.

Right now the only way I can achieve this seems inflexible as I am floating each post left & have the width set to 250%. This works now but as more posts get added, I'll have to manually change the width to accomodate for each new post.

Is this possible using only CSS or will I need to write a JS that expands the width the accomodate the width of the page content?

Any help is greatly appreciated!

1 answer


What I would do is have a container div set to some percent greater than 100%. Try 500% to make sure it's going well out of view. You would then have fixed width divs inside of that container all floated left. Make sure you put "overflow-x:scroll;" on the body in your stylesheet.

Every div that you have that's floating left will stack along the x-axis of the website, and eventually become hidden off of the right side of the page. That's where "overflow-x:scroll;" comes in. This adds a scrollbar to the bottom of your screen so you can scroll to the "overflowed" content. If you had links to bring you to each post, you could set up anchor tags, and install or write a javascript/jQuery plugin to slide to a certain post when you click a link.

I hope I had the right idea of what you're trying to do, and I hope this helps!

Good luck!

Answered about 6 years ago by Jared Tomeck