1

私は頭を包み込むことができないこの奇妙な小さな問題を抱えています。必要なことは次のとおりです。3つのセルを持つテーブル、すべてのセルの上の境界線と中央のセルの左右の境界線を除いて、白い境界線はありません。

コードは次のとおりです。

CSS:

table{
    font-family: verdana,arial,sans-serif;
    font-size:11px;
    border-width: 1px;
    border-collapse: collapse;
}
table td {
    border-width: 1px;
    padding: 8px;
    border-style: solid;
    border-top-color:#000000;
    border-right-color:#FFFFFF;
    border-bottom-color:#FFFFFF;
    border-left-color:#FFFFFF;
}

table td.centercell {
    border-width: 1px;
    padding: 8px;
    border-style: solid;
    border-top-color: #000000;
    border-right-color:#000000;
    border-bottom-color:#FFFFFF;
    border-left-color:#000000;
    z-index:10;
}

HTML:

<table>
    <tr>
        <td>Info Header 1</td>
        <td class="centercell">Info Header 2</td>
        <td>Info Header 3</td>
    </tr>
</table>

なぜ私がそれを修正できないのか、誰にも分かりませんか？

4

3 に答える 3

0

ダメージを与えているのは、テーブルのボーダー崩壊です。明らかに、あなたはまだそれを必要とするでしょう。. .

最初のセルに border-right を追加し、2 番目のセルには border-right のみを追加します。

table td.centercell {
    border-width: 1px;
    padding: 8px;
    border-style: solid;
    border-top-color: #000000;
    border-right-color:#000000;
    z-index:10;
}  
td:first-child{
    border-right: 1px solid #000000;
}

ここでフィドル：http://jsfiddle.net/7t85q/

于 2013-10-17T14:04:17.290 に答える