Title: Change stacking order? Last modified: August 24, 2016 --- # Change stacking order? * [paultoon](https://wordpress.org/support/users/paultoon/) * (@paultoon) * [11 years, 1 month ago](https://wordpress.org/support/topic/change-stacking-order/) * This theme stacks latest posts on the homepage in a masonry layout. By default it stacks posts from top to bottom, then left to right, like this, where 1 is most recent post and 16 is the oldest: * 1 5 9 13 2 6 10 14 3 7 11 15 4 8 12 16 * This means some of the most recent posts are not always on the top of the page. Is it possible to change to stack posts from left to right then top to bottom? Like this: * 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 * Hope that makes sense! Thanks in advance. Viewing 7 replies - 1 through 7 (of 7 total) * [Melodyk](https://wordpress.org/support/users/melody62/) * (@melody62) * [10 years, 11 months ago](https://wordpress.org/support/topic/change-stacking-order/#post-6079022) * ? Where have the other comments about this item gone ? * Earlier today…. i commented here … about an email to the themebuilder about this issue… I still haven’t received a reaction though.. * [Melodyk](https://wordpress.org/support/users/melody62/) * (@melody62) * [10 years, 11 months ago](https://wordpress.org/support/topic/change-stacking-order/#post-6079023) * … ‘its not possible’ … * was what i got… * [electrosoul](https://wordpress.org/support/users/electrosoul/) * (@electrosoul) * [10 years, 3 months ago](https://wordpress.org/support/topic/change-stacking-order/#post-6079052) * I’ve also been hooked by the awesomeness of Stacker-Lite, and frustrated by the vertical post order. * Themebuilder is right in principle by saying “It’s not possible” — because stacker is designed to stack. That’s how it makes such a pretty tiled grid. If items with potentially-varying-heights were ordered horizontally, it wouldn’t look like a pretty stack. * But to say “it’s not possible” is wrong in practice. Everything’s possible! * I’m close to getting what you were describing… My approach goes something like this: 1. Create a child theme (stacker-lite-child) 2. In your child theme’s CSS: * 1. set a max-width for .wrapper 2. set a max-width and max-height for .item 3. set float:left for .item 4. set .masonry to have -moz-column-count:1, -webkit-column-count:1, and column- count:1. * You’ll need to tinker with borders and spacing, but this should get the job done. * P.S. Did I mention that this is my first post ever on a WordPress forum? It is. Sorry in advance for any violation of convention here. * [electrosoul](https://wordpress.org/support/users/electrosoul/) * (@electrosoul) * [10 years, 3 months ago](https://wordpress.org/support/topic/change-stacking-order/#post-6079053) * Oh darn; I hadn’t realized that the approach above also screws with the post pages. Not insurmountable, but it’s a little more complicated. * [electrosoul](https://wordpress.org/support/users/electrosoul/) * (@electrosoul) * [10 years, 3 months ago](https://wordpress.org/support/topic/change-stacking-order/#post-6079054) * Update: I think I’ve got it working. And apparently floats are *so* last decade( or so it would seem), so I’m using flexbot. * Unless someone changes something, all you need is: 1. Make a folder: wp-content/themes/stacker-lite-child 2. Add a new file to that folder, called style.css 3. The contents of the new style.css should be: 4. ``` /* Theme Name: Stacker Lite Child Theme Theme URI: https://wordpress.org/themes/stacker-lite/ Description: Stacker Lite Child Theme Author: ThemeFurnace Author URI: https://wordpress.org/themes/author/themefurnace/ Template: stacker-lite Version: 1.0.0 */ @import url("../stacker-lite/style.css"); .masonry { max-width: 850px; display: -webkit-box; display: -moz-box; display: -ms-flexbox; display: -webkit-flex; display: flex; justify-content: center; align-items: flex-start; flex-flow: row wrap; margin: 0 auto; } .item:not(.inside) { height: 500px; flex: 0 0 260px; margin: 10px; } ``` 5. And finally: activate your child theme in wp-admin * If you know what you’re doing, and this doesn’t look right, please let me know. I rarely know what I’m doing. * [Nuzzina](https://wordpress.org/support/users/nuzzina/) * (@nuzzina) * [10 years, 1 month ago](https://wordpress.org/support/topic/change-stacking-order/#post-6079059) * electrosoul, I used your workaround, but in this way I have 1 column: * 1 2 3 4 5 6 * While I want: * 1 2 3 4 5 6 * How can I solve this? * Thanks * [electrosoul](https://wordpress.org/support/users/electrosoul/) * (@electrosoul) * [10 years, 1 month ago](https://wordpress.org/support/topic/change-stacking-order/#post-6079060) * [@nuzzina](https://wordpress.org/support/users/nuzzina/) — there’re lots of potential reasons for that problem (assuming its a problem — with flexbot there should only be one column if the browser is resized to a small width). It could be that your browser doesn’t support flexbot, there could be a typo in the css, ThemeFurnace might’ve updated something that caused my workaround to break, I could’ve made a mistake in my code, or ???. It’d be ideal if you could include a link to your site, if you want me (or anyone else who’s listening) to check it out. Hope we can get it fixed! Viewing 7 replies - 1 through 7 (of 7 total) The topic ‘Change stacking order?’ is closed to new replies. * ![](https://i0.wp.com/themes.svn.wordpress.org/stacker-lite/1.0.4/screenshot. png) * Stacker Lite * [Support Threads](https://wordpress.org/support/theme/stacker-lite/) * [Active Topics](https://wordpress.org/support/theme/stacker-lite/active/) * [Unresolved Topics](https://wordpress.org/support/theme/stacker-lite/unresolved/) * [Reviews](https://wordpress.org/support/theme/stacker-lite/reviews/) * 7 replies * 4 participants * Last reply from: [electrosoul](https://wordpress.org/support/users/electrosoul/) * Last activity: [10 years, 1 month ago](https://wordpress.org/support/topic/change-stacking-order/#post-6079060) * Status: not resolved