Skip to content

Instantly share code, notes, and snippets.

@lucprincen

lucprincen/Solving Flexbox Froggy level 24

Last active January 3, 2026 09:29
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save lucprincen/9548ab19bfc34f10ef8a to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save lucprincen/9548ab19bfc34f10ef8a to your computer and use it in GitHub Desktop.
Download ZIP
Raw
Solving Flexbox Froggy level 24
flex-flow:column-reverse wrap-reverse;
justify-content:center;
align-content:space-between;
@AishaA-cpu
Copy link

AishaA-cpu commented Jul 4, 2025

Screenshot 2025-07-04 at 19 06 08

@Somtofodum
Copy link

Somtofodum commented Jul 17, 2025

Screenshot 2025-07-17 at 07 46 11

@dhvrtyg
Copy link

dhvrtyg commented Aug 14, 2025

Screenshot 2025-08-14 at 9 25 55 PM

@Giannasaurus
Copy link

Giannasaurus commented Oct 14, 2025

Thanks. I didn't know there was such thing as "wrap-reverse" and I didn't read the guide from previous levels properly. Lol

@DOZstudio
Copy link

DOZstudio commented Oct 21, 2025

im hard worker not smart worker :,)

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

@VarunRazdan
Copy link

VarunRazdan commented Dec 14, 2025 •
edited
Loading 

#pond 
{
display: flex;
flex-flow: column-reverse wrap-reverse;
justify-content: center;
align-content: space-between;
}
Solved Flexbox Froggy Level 24 This is the flexbox froggy level 24 solved in 3 steps

The trickiest part is using flex-flow column and wrap and reversing them.

flex-flow: column-reverse wrap-reverse;

@VarunRazdan
Copy link

VarunRazdan commented Dec 14, 2025

Thanks. I didn't know there was such thing as "wrap-reverse" and I didn't read the guide from previous levels properly. Lol

They didn't really mention wrap-reverse specifically, just that flex-flow is a combination of flex-wrap and flex-direction . It's really tricky to try the values of each property and know we can literally combine them into one (e.g. column-reverse)

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