On my webpage [www.yogoro.me], flex layout was working perfectly.
These days I visited my own website and noticed that, with no adjustment/change from my side, flex alyout was not working properly anymore.
The problem:
Inside a box [here called parent-box] I have:
1] a heading
2] a hidden box
3] a link box
At this parent-box, with minimun height of 300px, ‘flex layout, direction-column, justify-space-between’ the last item [3] used to be at the bottom.
Now there is a considerable space between the bottom of this parent-box and the last item.
So many containers max! I cleaned it up a bit and placed your two “box” divs inside your container and gave them a 48% width. Changed the display setting of the container to flex box and laid it out to justify spacing between the boxes. Also did some editing of the individual boxes so that they appear properly wether all elements inside of them are showing or not. Here are all the changes and how it can work for you:
Thanks for your nice and quick reply.
Not sure if I did it right, but…
After completing your instructions, I realized that when one ‘hidden dropdown’ is opened [through the ‘arrow’], both boxes are expanded, instead of just the one which was clicked.
I also try to keep the ‘dropdown content’ closer to the box’s main title, not centered like in the right box of your screenshot.
For now, I’m still keeping the quick fix solution that I mentioned before.