Skip to content

Instantly share code, notes, and snippets.

@aphillipo

aphillipo/flexboxfroggy.com

Last active December 2, 2015 08:40
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save aphillipo/59ab3b54419c97d96687 to your computer and use it in GitHub Desktop.
Save aphillipo/59ab3b54419c97d96687 to your computer and use it in GitHub Desktop.
Download ZIP
Raw
flexboxfroggy.com
flex-flow: column-reverse wrap-reverse;
justify-content: center;
align-content: space-between;
@klingtnet
Copy link

I can't find a solution, the closest I can get is this:

flex-direction: column-reverse;
flex-wrap: wrap-reverse;
justify-content: center;
align-items: space-between;

screenshot from 2015-12-01 21-56-04

The same result on Chromium 46.0.2490.86 (64-bit) - Linux, Firefox 42 and Google Chrome 46.0.2490.86 (64-bit).

Nevertheless, it was a lot of fun to learn those flex-box properties with your game!

@aphillipo
Copy link
Author

Yes it was weird - I tried several different things to get the above working.

If I copy and paste my solution in (which looks identical to yours) it works if I copy and paste yours it fails!!!!

@klingtnet
Copy link

And I thought learning Rust was hard 😅

@henryfjordan
Copy link

align-content, not align-items

@jots
Copy link

jots commented Dec 1, 2015

https://github.com/thomaspark/flexboxfroggy/blob/gh-pages/levels.js will tell you the answer :-)

@klingtnet
Copy link

@henryfjordan: Thanks for the hint!
I'm surprised that I missed the different keywords in my answer and the original one.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment