テーブル内のIE11で入力要素の位置を指定しています。

Question

IE11がテキストアラインメントを保持しない理由を理解するにはいくつかの問題があります。私はJSのフィドルを作成しました。基本的には、テーブルセルの中央に2つのチェックボックスが重ねて表示されていました。

table { 
 
    width:100%; 
 
    height: 50px; 
 
    text-align: center; 
 
} 
 

 
#box1 { 
 
    position: absolute; 
 
}

<table> 
 
<tr> 
 
    <td>test</td> 
 
    <td> 
 
    <input id="box1" type="checkbox"> 
 
    <input id="box2" type="checkbox"> 
 
    </td> 
 
    <td>test</td> 
 
</tr> 
 
<tr> 
 
    <td>test</td> 
 
    <td>test</td> 
 
    <td>test</td> 
 
</tr> 
 
</table>

https://jsfiddle.net/3f5993oc/ これはクロームではなく、IEで動作します。私は両方のブラウザで動作するソリューションを探しています。どんな助けもありがとうございます。相対/絶対、coordonatesとマージンHTTPSをリセットします。

Answer 1

はIEのために、あなたはposition:relative/absolute、coordonatesを使用してIEのために、あなたがポジションを使用する必要がmargin

table { 
 
    width: 100%; 
 
    height: 50px; 
 
    text-align: center; 
 
} 
 

 
td { 
 
    position: relative; 
 
} 
 

 
#box1 { 
 
    left: 0; 
 
    right: 0; 
 
    margin: 0.175em auto; 
 
    position: absolute; 
 
}

<table> 
 
    <tr> 
 
    <td>test</td> 
 
    <td> 
 
     <input id="box1" type="checkbox"> 
 
     <input id="box2" type="checkbox"> 
 
    </td> 
 
    <td>test</td> 
 
    </tr> 
 
    <tr> 
 
    <td>test</td> 
 
    <td>test</td> 
 
    <td>test</td> 
 
    </tr> 
 
</table>