web-dev-qa-db-ja.com

RadioButtonListラベルテキストがボタンの下で折り返されるのを防ぐにはどうすればよいですか

ラジオボタンのリストがありますが、一部のラベルは非常に長いため、折り返され、2行目がラジオボタンの下に表示されます。理想的には、最初の行の最初の文字の下から始まる2番目の行でテキストを折り返したいと思います。

どのようにアイデアはありますか?または、これに対して独自のリストベースのコントロールを作成する必要がありますか?

27
Mark Dickinson

このCSSは実際にトリックを行います:

<style type="text/css">
 table.radioWithProperWrap input
 {    
      float: left;
 }

 table.radioWithProperWrap label
 {    
      margin-left: 25px;
      display: block;
 }
</style>
<asp:RadioButtonList runat="server" CssClass="radioWithProperWrap" ....>
40
Jose Basilio

ラジオボタンと個別のラベルを使用して、そのラベルの AssociatedControlID プロパティを設定できます。

<table>
    <tr>
        <td>
            <asp:RadioButton runat="server" ID="rdo" />
        </td>
        <td>
            <asp:Label runat="server" ID="lbl" Text="Radio Text" AssociatedControlID="rdo" />
        </td>
    </tr>
</table>
2
Kirtan

私はそれがゲームの少し遅いことを知っています、しかしこれは私のために働きました:

    table.NoWrapRadio td
    {
        white-space:nowrap;
    }

選択した回答者のアプローチを使用した場合、折り返しの問題は修正されましたが、ラジオボタンがラベルよりも低いピクセルで表示されていました。 IE9互換モードを使用しています。

2

選択した回答を機能させるのに問題がある場合:RadioButtonListがRepeatLayout="Table"ではなくRepeatLayout="Flow"を使用している場合にのみ機能します。それを捕まえるのに少し時間がかかりました。

0
amonroejj

負のテキストインデントスタイルを試してください-20pxはIE8で機能します

0
Fred