flex布局,子元素撑开父元素

1.将父元素设置为display:flex时,子元素不设高度时(宽度需要设置)会默认撑开满父元素高度:
flex布局,子元素撑开父元素_第1张图片
flex布局,子元素撑开父元素_第2张图片
2.经典两栏布局
flex布局,子元素撑开父元素_第3张图片
flex布局,子元素撑开父元素_第4张图片
如果child1有子元素的话,并且子元素宽度过大,会撑开child1,将child2的宽度挤压,如下:
flex布局,子元素撑开父元素_第5张图片

flex布局,子元素撑开父元素_第6张图片
解决办法将child1的宽度设置为:width:0;

你可能感兴趣的:(CSS,css)