Hi there, I have been working in the Tea Cozy mission and stuck about the Tea of the Month thumbnails. My thumbnails are just one column down even I applied display: flex and flex-flow: column wrap and inline-flex.
try flex row instead
Thanks for the response. Yes, when I put flex row it will go back to row but the rest of the boxes will be out of the box container as a straight line instead of going to the next line down below inside of the container. I know I missed something here.
What is the inline-flex for? That is typically used when you want to put multiple flex boxes on one row: display: inline-flex; If you are putting it in as a value for flex-flow, that could be your problem. An incorrect value in their will make the browser ignore that whole property and not apply the wrap
Either make flex-flow be flex-flow: row wrap; or change the whole property to flex-wrap: wrap;
You can then use justify-content to make the bottom row look nicer.
1 Like