問題描述
我有一些 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: 3px 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: 3px 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.
這篇關于IE8 的第一個孩子和最后一個孩子的文章就介紹到這了，希望我們推薦的答案對大家有所幫助，也希望大家多多支持html5模板網(wǎng)！