html - 表形式的数据使IE 8中的div溢出并且表中断

我有一个使用div创建的表，并将不同的类应用于每个表。当任何一列中的数据超过一行时，表结构就会失真，并且所有内容都会混乱。

Chrome和Firefox自动扩展行高以容纳数据。问题仅在于Internet Explorer 8。

我附上下面的代码。请提供您的输入。

谢谢

html在这里：

<fieldset>
    <div class="ListHead" id="list_div">
        <a class="ListItem col1" href="sort.do">
        <a class="ListItem col2" href="sort.do ">
        <a class="ListItem col3" href="sort.do">
        <a class="ListItem col4" href="sort.do">
        <a class="ListItem col5" href="sort.do">
    </div>
    <div class="ListRow0">
        <a class="ListItemRow col1" href="dosomething">
        <span class="ListItem col2">
        <span class="ListItem col3">
        <span class="ListItem col4">
        <span class="ListItem col5">
    </div>
    <div class="ListRow1">
        <a class="ListItemRow col1" href="dosomething">
        <span class="ListItem col2">
        <span class="ListItem col3">
        <span class="ListItem col4">
        <span class="ListItem col5">
    </div>
    <div class="ListRow0">
        <a class="ListItemRow col1" href="dosomething">
        <span class="ListItem col2">
        <span class="ListItem col3">
        <span class="ListItem col4">
        <span class="ListItem col5">
    </div>
    <div class="ListRow1">
        <a class="ListItemRow col1" href="dosomething">
        <span class="ListItem col2">
        <span class="ListItem col3">
        <span class="ListItem col4">
        <span class="ListItem col5">
    </div>
</fieldset>

这是CSS：

fieldset {
    margin: 0.5em 0 0 0;
    padding: 0.5em 0 0 0;
    border: 1px solid #bdc1c2;
    font-family: Tahoma, Arial, sans-serif;
    color: #09072c;
    background-color: #f1f2f6;
    background-image: url(../image/BannerGifs/fieldset_grad.jpg);
    background-repeat: repeat-x;
    font-size: 0.75em;
}

.ListHead {
    text-align: left;
    width: 100%;
    color: #09072c;
    font-weight: bold;
    padding: 5px;
    overflow: hidden;
}
.ListRow0 {
    background-color: white;
    color: #09072c;
    border: 1px solid #c3c3c3;
    padding: 5px;
    overflow: hidden;
    font-size: 0.75em;
    font-family: Tahoma, Arial, sans-serif;
}

.ListRow1 {
    background-color: #fbf9fb;
    color: #09072c;
    border: 1px solid #c3c3c3;
    padding: 5px;
    overflow: hidden;
    font-size: 0.75em;
    font-family: Tahoma, Arial, sans-serif;
}
.ListItem {
    padding: 0 0.5em;
    margin: 0;
    vertical-align: top;
    word-wrap: break-word;
    display: block;
    float: left;
    overflow: hidden;
}
.col1 {
    width: 10%;
}
.col2 {
    width: 15%;
}
.col3 {
    width: 15%;
}
.col4 {
    width: 30%;
}
.col5 {
    width: 15%;
}

最佳答案

只需将使用div创建的表替换为简单表标签即可。

试图保留现有代码。经过一段时间的努力后，决定用代码替换所有此类表格数据表。

解决所有问题。