Вот моя проблема.Он отлично выглядит в Firefox, Safari, IE8, но в режиме сравнения IE7 и IE8 он добавляет около 4000 пикселей по ширине к элементам div.team, вложенным в элемент списка.проблема исчезнет, если я удалю элементы span.score.
Приложенное изображение показывает результат в первом поле белым текстом.Верхнее изображение - это то, как оно должно выглядеть.Внизу IE7.
Я пытался понять это часами.Я даже пытался сделать список кучей div в случае, если это была странная ошибка элемента списка IE7, но я получил точно такие же результаты.
Вот мой HTML:
<ul class="selected" data-league="ncaaf">
<li>
<div class="time">THU 12:30PM</div>
<div class="teams">
<div class="team">AUB (21) <span class="score">10</span></div>
<div class="team">MSST <span class="score">22</span></div>
</div>
</li>
...
Вот мойCSS:
.boxList ul {
float:left;
margin:0 0 0 0;
heigth:40px;
width:5000px;
clear:left;
display:none;
}
.boxList ul.selected {
display:block;
}
.boxList li {
float:left;
height:40px;
padding:0 5px;
min-width:56px;
background:url(../images/scoreSchedBoxTile.png) repeat-x;
border:1px solid #000;
list-style-type:none;
margin:0;
font-size:9px;
line-height:13px;
font-weight:bold;
cursor:pointer;
position:relative;
}
.boxList li .time {
text-align:center;
}
.boxList li .teams {
}
.boxList li .team {
text-align:left;
color:#000;
clear:left;
line-height:13px;
height:13px;
}
.boxList li .score {
font-weight:bold;
text-align:right;
color:#fff;
float:right;
display:block;
}