0

このテーブルは PHP で動的に生成されますが、何らかの理由で境界線が正しく表示されません。私を困惑させる CSS の側面がまだいくつかあります。要素の境界線に設定したものを Firefox が上書きする理由を理解できる人はいますか? 生成された HTML は次のとおりです。

<table style="width:208px;">
<tr>
    <td colspan="7">
        <table style="width:100%; border-collapse:collapse">
            <tr>
                <td style="background-color:#999999; color:#FFFFFF; text-align:center; height:28px;">&lt;</td>
                <td colspan="5" style="background-color:#999999; color:#FFFFFF; text-align:center; height:28px;">September</td>
                <td style="background-color:#999999; color:#FFFFFF; text-align:center; height:28px">&gt;</td>
            </tr>
         </table>
     </td>
</tr> 
<tr>
    <td style="background-color:#999999; color:#FFFFFF; text-align:center; width:28px; height:28px; border:thin; border-color:#FFFFFF; border-style:solid;">S</td>
    <td style="background-color:#999999; color:#FFFFFF; text-align:center; width:28px; height:28px; border:thin; border-color:#FFFFFF; border-style:solid;">M</td>
    <td style="background-color:#999999; color:#FFFFFF; text-align:center; width:28px; height:28px; border:thin; border-color:#FFFFFF; border-style:solid;">T</td>
    <td style="background-color:#999999; color:#FFFFFF; text-align:center; width:28px; height:28px; border:thin; border-color:#FFFFFF; border-style:solid;">W</td>
    <td style="background-color:#999999; color:#FFFFFF; text-align:center; width:28px; height:28px; border:thin; border-color:#FFFFFF; border-style:solid;">T</td>
    <td style="background-color:#999999; color:#FFFFFF; text-align:center; width:28px; height:28px; border:thin; border-color:#FFFFFF; border-style:solid;">F</td>
    <td style="background-color:#999999; color:#FFFFFF; text-align:center; width:28px; height:28px; border:thin; border-color:#FFFFFF; border-style:solid;">S</td>
</tr>
<tr>
    <td colspan="7">
        <table style="width:100%; border:thin; border-color:#000000; border-style:solid; background-color:#FFFFFF; color:#000000">
            <tr style="border:thin; text-align:center;">
                <td style="border:thin; text-align:center;"></td>
                <td style="border:thin; text-align:center;"></td>
                <td style="border:thin; text-align:center;"></td>
                <td style="border:thin; text-align:center;"></td>
                <td style="border:thin; text-align:center;"></td>
                <td style="border:thin; text-align:center;"></td>
                <td style="border:thin; text-align:center;"></td>
            </tr>
            <tr style="border:thin; text-align:center;">
                <td style="border:thin; text-align:center;">1</td>
                <td style="border:thin; text-align:center;">2</td>
                <td style="border:thin; text-align:center;"><div style="border-style:solid; border:thin; border-color:#008000; height:27px; width:27px">3</div></td>
                <td style="border:thin; text-align:center;"><div style="border-style:solid; border:thin; border-color:#0000FF; height:27px; width:27px">4</div></td>
                <td style="border:thin; text-align:center;">5</td>
                <td style="border:thin; text-align:center;">6</td>
                <td style="border:thin; text-align:center;">7</td>
            </tr>
            <tr style="border:thin; text-align:center;">
                <td style="border:thin; text-align:center;">8</td>
                <td style="border:thin; text-align:center;">9</td>
                <td style="border:thin; text-align:center;"><div style="border-style:solid; border:thin; border-color:#008000; height:27px; width:27px">10</div></td>
                <td style="border:thin; text-align:center;">11</td>
                <td style="border:thin; text-align:center;">12</td>
                <td style="border:thin; text-align:center;">13</td>
                <td style="border:thin; text-align:center;">14</td>
            </tr>
            <tr style="border:thin; text-align:center;">
                <td style="border:thin; text-align:center;">15</td>
                <td style="border:thin; text-align:center;">16</td>
                <td style="border:thin; text-align:center;">17</td>
                <td style="border:thin; text-align:center;">18</td>
                <td style="border:thin; text-align:center;">19</td>
                <td style="border:thin; text-align:center;"><div style="border-style:solid; border:thin; border-color:#008000; height:27px; width:27px">20</div></td>
                <td style="border:thin; text-align:center;"><div style="border-style:solid; border:thin; border-color:#0000FF; height:27px; width:27px">21</div></td>
            </tr>
            <tr style="border:thin; text-align:center;">
                <td style="border:thin; text-align:center;">22</td>
                <td style="border:thin; text-align:center;">23</td>
                <td style="border:thin; text-align:center;">24</td>
                <td style="border:thin; text-align:center;">25</td>
                <td style="border:thin; text-align:center;">26</td>
                <td style="border:thin; text-align:center;"><div style="border-style:solid; border:thin; border-color:#F5831C; height:27px; width:27px">27</div></td>
                <td style="border:thin; text-align:center;">28</td>
            </tr>
            <tr style="border:thin; text-align:center;">
                <td style="border:thin; text-align:center;">29</td>
                <td style="border:thin; text-align:center;"><div style="border-style:solid; border:thin; border-color:#F5831C; height:27px; width:27px">30</div></td>
                <td style="border:thin; text-align:center;"></td>
                <td style="border:thin; text-align:center;"></td>
                <td style="border:thin; text-align:center;"></td>
                <td style="border:thin; text-align:center;"></td>
                <td style="border:thin; text-align:center;"></td>
            </tr>
        </table>
    </td>
</tr>

4

2 に答える 2

3

次のような境界線属性を完成させます style="border:thin solid silver;

これが役立つことを願っています

于 2012-09-13T01:33:17.133 に答える
0

発生しているエラーについてはわかりませんが、border:thin を border:2px; に変更してみてください。

thin = ie では 2px ですが、FF と Chrome では 1px です。

于 2012-09-13T01:29:17.253 に答える