html: 3 列，居中必须固定宽度

Question

我需要在一行中有 3 列。中间的列是固定宽度的，但左右列必须是可变的。我还需要用 Android 和 IE8 打开这个页面。所以它应该适用于旧浏览器。

我需要:

我的尝试，但没有成功:

.left {
    float: left;
    width: 100%;
    margin-left: -50%;
    height: 230px;
    background: url('left.png') no-repeat right top;
}
.center {
    float: left;
    margin-left: -62px;
    background: #FDE95E;
    width:123px;
    height:123px;
    background: url('center.png');
}
.right {
    float: left;
    width: 50%;
    height:230px;
    background: url('right.png') no-repeat left top;
}

HTML:

<div class="left"><br></div>
<div class="center"><br></div>
<div class="right"><br></div>
<div style="clear: both;"></div>

Answer 1

CSS

.left {
    background: red;
    float: left;
    height: 500px;
    width: calc(50% - 50px);

}
.center {
    background: gray;
    height: 500px;
    width: 100px;
    margin: auto;
}
.right {
    background: red;
    float: right;
    height: 500px;
    width: calc(50% - 50px);
}

html

<div class="left">Left</div>
<div class="right">Right</div>
<div class="center">Center</div>
<div style="clear: both;"></div>

http://jsfiddle.net/usb9sbje/