84669 person learning
152542 person learning
20005 person learning
5487 person learning
7821 person learning
359900 person learning
3350 person learning
180660 person learning
48569 person learning
18603 person learning
40936 person learning
1549 person learning
1183 person learning
32909 person learning
今天去面试的时候出现了这样一道题：要求大容器在宽度自由伸缩的情况下，内部三个子元素宽度始终1:1:1，如何实现，请尽量写出俩种方法？
我给的答案：方式一：弹性盒子布局方式：（存在性兼容问题,ie系基本挂了，移动端4.3+）父容器：dispaly:flex;子容器分别设置：flex:1;方式二：不知道说什么了，就写了，在父容器定宽的情况下，可以使用百分比各占1/3的方式。
不知道weber有开发过这种情况的吗？
小伙看你根骨奇佳，潜力无限，来学PHP伐。
响应式Web设计 - 布局
看响应式Web设计 - 布局后突然有些思路，补充一下，也不知道这样是否能满足这道题目要求，也无从获取面试官正确答案了。答这个问题时，自己以为没有设置宽度和没有设置高度（父容器没有设置高度，子容器设置百分比的高度无法生效）会出现一样的问题，这个明显是错误的。一个没有设置宽度的块级元素默认占满父容器宽度，所以如果要设置三列各占33%是能够等宽:1.使得子元素横向排列；2.使得子元素宽度一致；
方案1：（行内块方式）
display:inline-block; width:33%;
方案2：(浮动方式)
float:left/right; width:30%;
方案3：（绝对定位方式）
position:absolute; width:33%; left:0/33%/66%;
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
响应式Web设计 - 布局
看响应式Web设计 - 布局后突然有些思路，补充一下，也不知道这样是否能满足这道题目要求，也无从获取面试官正确答案了。
答这个问题时，自己以为没有设置宽度和没有设置高度（父容器没有设置高度，子容器设置百分比的高度无法生效）会出现一样的问题，这个明显是错误的。一个没有设置宽度的块级元素默认占满父容器宽度，所以如果要设置三列各占33%是能够等宽:
1.使得子元素横向排列；
2.使得子元素宽度一致；
方案1：（行内块方式）
方案2：(浮动方式)
方案3：（绝对定位方式）