Html 表格形式的数据溢出IE 8中的div,表格中断

Html 表格形式的数据溢出IE 8中的div,表格中断,html,css,google-chrome,firefox,internet-explorer-8,Html,Css,Google Chrome,Firefox,Internet Explorer 8,我有一个使用div和应用于每个div的不同类创建的表。当任何一列中的数据超过一行时,表结构就会扭曲,一切都会乱七八糟 Chrome和Firefox会自动扩展行高以容纳数据。问题仅限于Internet Explorer 8 我附上下面的代码。请提供你的意见 谢谢 html在这里: <fieldset> <div class="ListHead" id="list_div"> <a class="ListItem col1" href="sort

我有一个使用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>

只是用simple table标记替换了使用div创建的表

试图保留现有代码。经过相当长一段时间的努力,我决定用代码替换所有这样的表格数据表

所有问题都解决了

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%;
}