Why parent div height become zero when we apply float on child divs.

Question

This is my code.

https://code.sololearn.com/Ww2Qi1Xuag9H/?ref=app

Answer 1

Gordon I found the answer by using this it work.

#main::after{
content:" ";
display:block;
height:0;
clear:both;
}

Answer 2

Gordon I know but i want to use float because float is supported in Internet explorer and in edge.grid and flex is partially supported by these browser.even with prefixes is not completely working.

Answer 3

use flex or grid instead

Answer 4

set height at parent