使用弹性盒布局来实现元素宽度与高度的自适应

<style type="text/css">#container{            display: -moz-box;    display: -webkit-box;            border: solid 1px blue;    -moz-box-orient: horizontal;             -webkit-box-orient:horizontal;    width: 500px;       height: 300px;}#text-a{      background-color: orange;}#text-b{     background-color: yellow;            -moz-box-flex: 1;            -webkit-box-flex: 1;}#text-c{    background-color: limegreen;}#text-a, #text-b, #text-c{    -moz-box-sizing: border-box;    -webkit-box-sizing: border-box;    font-size: 1.5em;    font-weight: bold;}<div id="container"><div id="text-a">示例文字A</div><div id="text-b">示例文字B</div><div id="text-c">示例文字C</div></div>