CSS - 嵌套的表格邊框顯示。我該如何阻止？

我正在使用ie 8. 我有以下CSS我想要顯示外部表的邊框，但不是嵌套在其中一個單元格內的表;CSS - 嵌套的表格邊框顯示。我該如何阻止？

table#ScheduledLeaveCalendar 
{ 
table-layout:fixed; 
} 

/* Calendar that shows annual leave */ 
#ScheduledLeaveCalendar 
{ 
    border-collapse:collapse; 
} 
#ScheduledLeaveCalendar td, #ScheduledLeaveCalendar th 
{ 
    font-size:0.8em; 
    border:1px solid #2906A6; /* dark blue */ 

} 
#ScheduledLeaveCalendar th 
{ 
    width:30px; 
    font-size:0.9em; 
    text-align:center; 
    padding:5px 3px 4px 3px; 
    padding-top:5px; 
    padding-bottom:4px; 
    background-color:#6640EE; /* blue */ 
    color:#ffffff; 
} 
#ScheduledLeaveCalendar td 
{ 
    padding: 0px; 
    margin: 0px; 
} 

#ScheduledLeaveCalendar table 
{ 
    border-collapse: collapse; 
    border: 0px; 
    margin: 0px; 
    padding: 0px; 
}

這個CSS給我 When splitting the cell in 2, the border becomes thicker

標記爲;

<table id="ScheduledLeaveCalendar"> 

    <tr> 
     <th colspan="2"></th> 
     <th colspan="6">Oct 2011</th> 
     <th colspan="1"></th> 
    </tr> 
    <tr> 
      <th>F</th><th></th><th>M</th><th>T</th><th>W</th><th>T</th><th>F</th><th></th><th>M</th> 
    </tr> 
    <tr> 
    <th>14</th><th></th><th>17</th><th>18</th><th>19</th><th>20</th><th>21</th><th></th><th>24</th> 
    </tr> 
    <tr> 
    <td class="StandardCellHeight&#32;DefaultColour"></td> 
    <td class="StandardCellHeight&#32;DefaultColour"></td> 
    <td><table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%"><tr><td /> 
<td class="StandardCellHeight&#32;AnnualLeaveColour" /> 
</tr></table></td> 
    <td><table border="0" cellpadding="0" cellspacing="0" height="100%" width="100%"><tr><td class="StandardCellHeight&#32;AnnualLeaveColour" /> 
<td /> 
</tr></table></td> 
    <td class="StandardCellHeight&#32;DefaultColour"></td> 
    <td class="StandardCellHeight&#32;DefaultColour"></td> 
    <td class="StandardCellHeight&#32;DefaultColour"></td> 
    <td class="StandardCellHeight&#32;DefaultColour"></td> 
    <td class="StandardCellHeight&#32;DefaultColour"></td> 

</tr> 

</table>

見http://jsfiddle.net/Dqm68/1/

來源

2011-10-03 arame3333

你可以做一個jsFiddle演示看起來像你的截圖？我嘗試過，但它不是很正確：http://jsfiddle.net/thirtydot/Dqm68/ – thirtydot

我剛剛這樣做。我是jsFiddle的新手，我應該開始使用它。 http://jsfiddle.net/Dqm68/1/ – arame3333

只需添加另一條線從嵌套表TD刪除邊框。

#ScheduledLeaveCalendar table td {border:none}

http://jsfiddle.net/blowsie/Dqm68/3/

來源

2011-10-03 09:20:04 Blowsie

很多問題是緩存阻礙瞭解決方案的運行。這一個做了，我確信另一個也做到了！ – arame3333

使用Ctrl + F5或這個整齊的Firefox插件https://addons.mozilla.org/en-US/firefox/addon/css-reloader/：D – Blowsie

我正在使用ctrl + F5，但我不知道FF reloader。謝謝你。 – arame3333

您可以使用

#ScheduledLeaveCalendar td td { 
    border: 0; 
}

這意味着嵌套在其他td元素不應該有邊界的td元素..

演示在http://jsfiddle.net/Dqm68/5/

來源

2011-10-03 09:23:59

CSS - 嵌套的表格邊框顯示。我該如何阻止？

回答

相關問題