Flexbox doesn't work in summary tag

Question

I have this pen where the layout is floated, but when I try to flexbox one container below the layout, the flexbox doesn\'t work. I know it is caused by the floats however, can\

Answer 1

Change the styles to this classes

#wrapper {
  width: 90%;
  margin:auto;
  padding: 0 20px 0 20px;
  margin-bottom:20px;
display:flex;
flex-direction:column
}

and on summary remove clear and display:flex every thing will work as expected

check this fiddle https://codepen.io/sahithiK/pen/LRqjoR?editors=1100

Hope this helps