IE9表格布局固定colspan不受尊重 [英] IE9 table-layout fixed colspan not respected

问题描述

我发现这个话题，我的相关但不一样：

基本上，我必须添加一个空行，其中包含正确的＃个空单元格：

 < table id =test> 
< tbody> 
< tr> 
< td>< / td> 
< td>< / td> 
< td>< / td> 
< td>< / td> 
< td>< / td> 
< td>< / td> 
< / tr> 
< tr> 
< td> COLSPAN = 1< / td> 
< td colspan =2> COLSPAN = 2< / td> 
< td> COLSPAN = 1< / td> 
< td colspan =2> COLSPAN = 2< / td> 
< / tr> 
< / tbody> 
< / table> 
  

不太漂亮......我需要删除单元格的填充以避免显示。感叹...

jsFiddle： http：// jsfiddle.net/DUCPp/5/

I found this topic, mine is related but not the same:

Table rendering with cols and colspan on tds in IE9

The problem I am having is that the 2nd colspan=2 in my table is not being read by IE9, funnily enough it works find in IE7 and IE8, but not IE9. Maybe I've done something completely wrong so here it is:

HTML:

<table id="test">
    <tbody>
        <tr>
            <td>COLSPAN = 1</td>
            <td colspan="2">COLSPAN = 2</td>
            <td>COLSPAN = 1</td>
            <td colspan="2">COLSPAN = 2</td>
        </tr>
    </tbody>
</table>

CSS:

#test {
    width: 100%;
    border-spacing: 20px;
    border-collapse: separate;
    table-layout: fixed;
}

#test td {
    position: relative;
    background-color: #cccccc;
    box-shadow: 3px 3px 2px rgba(0,0,0,0.5);
    padding: 10px;
}

jsFiddle: http://jsfiddle.net/DUCPp/1/

What is supposed to happen:

What IE9 gives me:

I am convinced this is a IE9 bug, but I haven't been able to find it on google (maybe I'm not searching the right keywords?). Any solutions or links to bug reports will be greatly appreciated!

UPDATE: I added an extra column after the 2nd colspan=2 column, and it will render correctly. I have deduced that if the last column in a row has colspan > 1, then it will only be rendered as if colspan = 1.

Any ideas on fixing? I'm now almost positive that this is a IE9 bug <_<

解决方案

Heh... IE9...

Found a "fix"... idea came from: Colspan on cell in one row seems to prevent setting TD width in all the other rows. Why?

Basically I had to add a empty row with the correct # of empty cells in it:

<table id="test">
    <tbody>
        <tr>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
            <td></td>
        </tr>
        <tr>
            <td>COLSPAN = 1</td>
            <td colspan="2">COLSPAN = 2</td>
            <td>COLSPAN = 1</td>
            <td colspan="2">COLSPAN = 2</td>
        </tr>
    </tbody>
</table>

Not pretty... and I needed to remove the padding for the cells in order for it not to display. Sigh...

jsFiddle: http://jsfiddle.net/DUCPp/5/

这篇关于IE9表格布局固定colspan不受尊重的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！