css - 父容器自由伸缩的情况下，子容器三列等宽布局如何实现

Question

今天去面试的时候出现了这样一道题：
要求大容器在宽度自由伸缩的情况下，内部三个子元素宽度始终1:1:1，如何实现，请尽量写出俩种方法？

我给的答案：
方式一：
弹性盒子布局方式：（存在性兼容问题,ie系基本挂了，移动端4.3+）
父容器：dispaly:flex;
子容器分别设置：flex:1;
方式二：
不知道说什么了，就写了，在父容器定宽的情况下，可以使用百分比各占1/3的方式。

不知道weber有开发过这种情况的吗？

Answer 1

响应式Web设计 - 布局

Answer 2

看响应式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%;