I would like to ask why the clear floating code I wrote is invalid.
and. How to use the flex layout to make the horizontal arrangement of the above two div fill the entire screen. The third div is filled with the bottom location.
code is as follows: `< body >
<article class="major">
<div class="major_left"></div>
<div class="major_right"></div>
<footer class="foot"></footer>
</article>
< / body > `
.major_left{
float: left;
width: 35%;
height: 70vh;
background: blue;
}
.major_right{
float: left;
width: 65%;
height: 70vh;
background: black;
}
.foot{
width: 100%;
height: 30vh;
background: red
}
.foot:before{
overflow: hidden;
height: 0;
clear: both;
visibility:hidden;
content: "";
display: block;
}