I’m trying to order DIVs with different content and size where you are recommended to read element in this order: One, Two, Three, Four, Five and Six. When you resize the screen (or read it on a smart phone) the DIVs are supposed to be stacked on top of each other in the same reading order. If the width of your screen only can show two columns you read One and two on the first row, three and four on the second and five and six on the last row.

My first idea is to just use float:left. Works kind of good. But only for the last column since it sets the height to all the other columns. Not so nice.

Then I tried to create 3 individual columns and put divs in each of them. This kind of works but you have to sort the DIVs in the wrong order in the HTML. And also the idea is that the DIVs should stack naturally when you make the window smaller. Well. Now they don’t. Too bad.

I searched for a while and found HNterest. They are positioning the DIVs absolute. Ok. So maybe I’ll resort to that? I’ll try that. Later.

Check my sample html and forge it on github as well.

Thanks to Adam for all help in this! I’m not sure what to do without you :)

See page 21 in GRÖNT #5 2011 on their web site, download the PDF or see a screenshot from my page.

We went out one afternoon and shoot the action part at Ramberget. We did the interview at Wieselgrensplatsen. I did photo and edit.

All work on this video is done as an employee at Medium Distribution.

As previous years we have a strong product catalogue area on the web site.

In 2012 we are really growing our team with at least 3 new team-riders and we are adding a new area for the team on our web site with both a blog and rider profiles. We are also adding a new map with all our European dealers, we are lifting all artists making graphics to us and all collaborators we have worked with. Oh! And we’re also making a brand new board matrix that helps you chose the right board!