CSS在WebKit和IE中均未按预期工作

我正在制作一个最终看起来像ESPN的底线的股票代码

Internet Explorer（7、8和9）尊重我的div上的width属性，但不尊重主div的居中

而WebKit（Safari 5和6，Chrome）和Firefox不尊重div的宽度，但会正确地将主div居中。我绞尽脑汁想让CSS在cross bowser中工作

HTML

---

问题是您正在将显示属性设置为

inline

。IE错误地尊重内联元素的width属性，而其他元素则遵循web标准，并且没有

你可以：

1） 将

内联

更改为

内联块

或

2） 将它们更改为

block

并使用

float

属性

---

下面解释如何使

内联块

在IE7中工作问题是您正在将显示属性设置为

内联

。IE错误地尊重内联元素的width属性，而其他元素则遵循web标准，并且没有

你可以：

1） 将

内联

更改为

内联块

或

2） 将它们更改为

block

并使用

float

属性

下面是如何让

内联块

在IE7中工作的说明

<div id="ticker">
    <div id="homeTeam">Team A</div>
    <div id="homeScore">1</div>
    <div id="awayTeam">Team B</div>        
    <div id="awayScore">2</div>
    <div id="remaining">Final</div>
</div>

#ticker {
    margin: auto;
    width: 778px;
    background-color: black;
    height: 28px;
    border-top-width: 3px;
    border-top-style: outset;
    border-top-color: #FFFFFF;
}

#homeScore {
    width: 60px;
    margin-left: -4px;
    padding-right: 10px;
    background-color: #79000a;
    font-size: 24px;
    color: white;
    display: inline;
    text-align: right;
}

#awayScore {
    width: 60px;
    margin-left: -4px;
    padding-right: 10px;
    background-color: #79000a;
    font-size: 24px;
    color: white;
    display: inline;
    text-align: right;
}

#homeTeam {
    width: 270px;
    padding-left: 10px;
    background-color: #7c000e;
    font-size: 24px;
    color: white;
    display: inline;
}

#awayTeam {
    margin-left: 25px;
    width: 270px;
    padding-left: 10px;
    background-color: #7c000e;
    font-size: 24px;
    color: white;
    display: inline;
}

#remaining {
    width: 76px;
    background-color: black;
    margin-left: 25px;
    font-size: 20px;
    color: white;
    display: inline;
    text-align: left;
}