jquery - CSS 边框和填充在 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 规则不起作用。

边框、填充 和显示。

谁能解释为什么会这样？

这是一个 jsfiddle使用呈现的 HTML。

更新

我感谢所有的评论和建议，我将研究修复我的标记...

另一个更新

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

Answer 1

这不仅是 IE 8+ 的问题，而且它在任何浏览器中都不起作用。

表格行中不能有填充。相反，您需要在 td 中添加填充样式。

而且我看不到您在代码中附加任何 td，所以我可以修改它。

因此，确保将填充样式放在 td 而不是 tr 中。

只需确保将 td 放入您的 tr 中，然后执行其余操作，例如边框和您想要的任何内容。