2

列がプログラムによって表示されるテーブルの表示に問題があります。

以下は、この問題が見られる HTML コードです (レンダリングに影響を与えるコード ビハインドではないことが確認されています)。

<table>
<tr>
    <th>NUMER</th>                                      
    <th>NAME</th>
    <th align="center" style="display:block;">LOCATION</th>
    <th align="center" style="display:none;">1</th>
    <th align="center" style="display:block;">2</th>
</tr>
<tr>
    <td>12345</td>
    <td>BOB Jr</td>                                     
    <td align="center" style="display:block;"><input type="CheckBox" ID="updateLocation" runat="server" /></td>
    <td align="center" style="display:none;"><input type="CheckBox" ID="updateLocation" runat="server" /></td>
    <td align="center" style="display:block;"><input type="CheckBox" ID="updateLocation" runat="server" /></td>                                            
</tr>

これは、Chrome および Firefox では次のように表示されます。ここに画像の説明を入力

スタイルはプログラムで追加されますが、これが明らかに問題を引き起こしていますが、この問題を解決するための提案があるかどうか疑問に思っていましたか?

この機能はユーザー主導であるため、表の列はプログラムで表示する必要があります。

また、これは IE で正常に動作することに注意してください。

4

2 に答える 2

1

使用しないでください

 display:block

それはテーブルと互換性がありません。

あなたは探している:

display:table-cell

とはいえ、特に古い IE をサポートする必要がある場合は、この質問をして先に進む前によく読んで回答することをお勧めします: show/hide html table columns using css

于 2013-05-29T13:54:46.857 に答える
1

この問題は、HTML コードの非常に特殊なスタイルが原因で発生しています。style="display:block" を HTML から (またはプログラムで挿入されたものから) 削除すると、問題が解決します。修正された HTML マークアップを参照してください。

<table>
<tbody>
    <tr>
        <th>NUMER</th>                                      
        <th>NAME</th>
        <th align="center" style="">LOCATION</th>
        <th align="center" style="display:none;">1</th>
        <th align="center" style="">2</th>
    </tr>
    <tr>
            <td>12345</td>
            <td>BOB Jr</td>                                     
            <td align="center" style=""><input type="CheckBox" id="updateLocation" runat="server"></td>
            <td align="center" style="display:none;"><input type="CheckBox" id="updateLocation" runat="server"></td>
            <td align="center" style=""><input type="CheckBox" id="updateLocation" runat="server"></td>                                            
    </tr>
</tbody>

お役に立てれば。

于 2013-05-29T14:11:53.537 に答える