sgnl/flexboxfroggy.css

Created December 26, 2015 20:02

Star 5 You must be signed in to star a gist
Fork 0 You must be signed in to fork a gist

Learn more about clone URLs
Clone this repository at <script src="https://gist.github.com/sgnl/2b90a395809609b0f648.js"></script>
Save sgnl/2b90a395809609b0f648 to your computer and use it in GitHub Desktop.

Download ZIP

Flex Box Froggy (http://www.flexboxfroggy.com) level 24 answer

Raw

flexboxfroggy.css

	#pond {
	display: flex;
	flex-flow: column-reverse wrap-reverse;
	justify-content: center;
	align-content: space-between;
	}

gregoryshaversjr commented May 13, 2020

Thank you guys. The below solution worked. Didn't think to use space-between but it makes sense.

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

ayyappag10 commented Jun 12, 2020

i wasn't aware of "wrap-reverse" property. so i solved it using transform,

transform: rotate(90deg);
flex-flow: row-reverse wrap;
justify-content: center;
align-content: space-between;

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