0

gridContainer divの新しいdivにテーブルコードを貼り付けました(Fluid Grid Layoutオプションを使用)。すべてが正常に見えますが、セル間隔が定義されています。間隔を変更しようとしても何も起こらず、0のままになります。

表のマークアップは次のとおりです。

<table align="center" cellpadding="0" cellspacing="15">
    <col span="7" width="160px" />
    <row span="7" width="160px" />
    <!---Row 1--->  
    <tr align="center"  height="160px">
        <td colspan="2" >
            <img src="images/buttons/Optimus.png" />
            </td>
        <td colspan="2" >
            <img src="images/buttons/MapleSim.png">
            </td>
        <td colspan="2" >
            <a href="content/maple.html" ><img src="images/buttons/Maple.png"></a>
            </td>
        <td colspan="1" bgcolor="#40b040">
            <img src="images/buttons/about_us.png">
            </td>
    </tr>

    <!---Row 2--->  
    <tr align="center"  height="160px">
        <td colspan="2" bgcolor="#40b040">
            <img src="images/buttons/QFD.white.png">
            </td>
        <td colspan="1" bgcolor="#cc00cc">
            <img src="images/buttons/learning_maple.png">
            </td>
        <td colspan="3" rowspan="2" 
            align="left" valign="top" bgcolor="#aaaaff">
            <img src="images/buttons/news.png">                 
            News will be shown here
            </td>
        <td colspan="1" bgcolor="#ff0000">
            <img src="images/buttons/services.png">
            </td>
    </tr>

    <!---Row 3--->  
    <tr align="center"  height="160px">
        <td colspan="1" bgcolor="#6766cc">
            <img src="images/buttons/events.png">
            </td>
        <td colspan="1" bgcolor="#cccc00">
            <img src="images/buttons/forum.png">
            </td>
        <td colspan="1" bgcolor="#4040ff">
            <img src="images/buttons/links.png">
            </td>
        <td colspan="1" bgcolor="#ffbf00">
            <img src="images/buttons/shopping_cart.png">
            </td>
    </tr>

    <!---Row 4--->  
    <tr align="center"  height="160px">
        <td colspan="2" bgcolor="#ff0000">
            <img src="images/buttons/commercial_users.png">
            </td>
        <td colspan="1" bgcolor="#ffbf00">
            <img src="images/buttons/student_special.png">
            </td>
        <td colspan="1" bgcolor="#40b000">
            <img src="images/buttons/student_special.png">
            </td>
        <td colspan="1" bgcolor="#ff00cc">
            <img src="images/buttons/instruction.png">
            </td>
        <td colspan="1" bgcolor="#cc00cc">
            <img src="images/buttons/learning_maple.png">
            </td>
        <td colspan="1" bgcolor="#4040ff">
            <img src="images/buttons/download.png">
            </td>
    </tr>
</table>

この行<table align="center" cellpadding="0" cellspacing="15">では、間隔が15であることがわかりますが、ブラウザをチェックすると、0に設定されていると表示されます。

それを解決する方法はありますか?

よろしくお願いします、Shahar

4

1 に答える 1

0

わかりました、私はあまりにも急いでいたと思います。

テーブルはboilerplate.cssからの2つの定義を使用したようです

table {
    /* [disabled]border-collapse: collapse; */
    /* [disabled]border-spacing: 0; */
}

ご覧のとおり、それらを無効にするだけで問題が解決しました。無効にせずにオーバーライドする他のオプションがある場合(おそらく!importantの使用法)、それについて知ってうれしいです。

于 2012-09-22T10:41:23.587 に答える