3

<td>HTMLテーブルの属性内に2つのラジオボタンがあります。どちらにも<label>タグが付いています。ご存知のように、テーブルタグには属性幅がありません。各ラジオボタンのラベルの間にスペースを設定するためのクロスブラウザソリューションを見つけようとしています。

私はこのコードを持っています:

<td class="changeUnitsSetLabelWidth">
  <?php echo $form->radio("changeUnitsMode",UnitsTabComponent::SET_ALL_METRIC)->set("id","changeUnitsMode_metric") . $form->label("changeUnitsMode", "Metric")->set("for","changeUnitsMode_metric");
        echo $form->radio("changeUnitsMode", UnitsTabComponent::SET_ALL_IMPERIAL)->set("id","changeUnitsMode_imperial") . $form->label("changeUnitsMode", "Imperial")->set("for","changeUnitsMode_imperial");
  ?>
</td>

CSSに次の行を追加しました。

.changeUnitsSetLabelWidth label{ display: inline-table; width: 80px;}

インターネットで検索したところ、IE7では機能しないことがわかりました(なんというニュースです!?!)ので、この表示を行う別の方法を見つけるのを手伝ってください:インラインテーブル、私が設定できる方法でラベルの幅。

4

4 に答える 4

3

ここでは使用display:inline-tableしても意味がありません。幅とその間のスペースのマージンを設定して設定するだけdisplay:inline-blockで問題ありません。

inline-block のように振る舞うための IE7 ハックは次のとおりです。

 zoom: 1;
 *display: inline;
于 2012-07-10T16:22:47.113 に答える
1

これを試して:

.changeUnitsSetLabelWidth input,
.changeUnitsSetLabelWidth label {
    float: left;
}
.changeUnitsSetLabelWidth label {
    padding-left: 10px;
    padding-right: 10px;
    width: 80px;
}
于 2012-07-10T16:15:16.307 に答える