IE边框和填充不适用于IE 8 + 9

Question

我有以下DOM和CSS:

var tableRow = jQuery(
    jQuery('<tr/>')
        .addClass('tr_class')
        .append(
            jQuery('<h3/>')
                .text('Title')
                .addClass('first_class second_class')
        )
).appendTo(table);


.tr_class{
    padding: 0px 0px 2px 5px;          /*not working*/
    display: block;                    /*not working*/
}


h3.first_class {
    font-weight: bold;                /*working*/
}


h3.second_class {
    border-bottom: 1px solid #5f7836; /*not working*/
    padding: 3px;                     /*not working*/
    display: block;                   /*not working*/
    font-size: 11px;                  /*working*/
}

在IE8 + 9中,我的一些CSS规则无效.

border,padding和display.

任何人都可以解释为什么会这样吗？

这是一个带有渲染HTML 的jsfiddle.

UPDATE

我很感谢所有的意见和建议,我将着眼于修复我的标记......

另一个更新

你们都是对的!我可怕的标记是这里的罪魁祸首.每个人的意见都非常感谢!

Answer 1

这不仅是IE 8+问题,而且在任何浏览器中都不起作用.

表行中不能填充.相反,你需要添加填充样式td.

我无法看到你td在代码中添加任何内容,因此我可以对其进行修改.

因此,请确保将填充样式放在您的td而不是tr.

只要确保放入td你tr的东西,做边界和你想要的任何东西.