问题描述
我有一些 css 用于调整我的表格中的东西.
I have some css for adjusting things in my table.
这里是:
.editor td:first-child { width: 150px; } .editor td:last-child input, .editor td:last-child textarea { width: 500px; padding: **x 5px 5px 5px; border: 1px solid #CCC; }
它适用于 Firefox、Safari 和 Chrome,但不适用于(目前)IE8.
It works with Firefox, Safari and Chrome but not (at this time) with IE8.
我知道问题来自第一个孩子和最后一个孩子,但我不是专家.
I know the problem comes from the first-child and last-child but I'm not an expert.
知道如何解决吗?
PS:我在我的 html 文档顶部添加了 <!doctype html> 但没有任何改变.
PS: I added <!doctype html> on top of my html document but nothing changed.
推荐答案
如果你的表只有 2 列,你可以很容易地使用相邻的兄弟选择器到达第二个 td,IE8 确实支持连同 :first-child:
If your table is only 2 columns across, you can easily reach the second td with the adjacent sibling selector, which IE8 does support along with :first-child:
.editor td:first-child { width: 150px; } .editor td:first-child + td input, .editor td:first-child + td textarea { width: 500px; padding: **x 5px 5px 5px; border: 1px solid #CCC; }
否则,您将不得不使用像 jQuery 这样的 JS 选择器库,或者手动将类添加到最后一个 td,James Allardice 建议.
Otherwise, you'll have to use a JS selector library like jQuery, or manually add a class to the last td, as suggested by James Allardice.