5

OK、これを理解できないのは本当に恥ずかしいですが...「必須」のアスタリスクが後に続くフォームラベルがあります。アスタリスクは、テキストの横に配置されるのではなく、単にラベル テキストの下の次の行にドロップされます。

必要なアスタリスクをラベル テキストと同じ行に配置したい。この権利のためにフロートを使用する必要はありませんか？それらは同じ div にあるため、なぜ隣同士に配置されないのかわかりません。

ありがとう！

ここに画像の説明を入力

    <div id="letsGetStarted">
    @using (Html.BeginForm())
    {

        @Html.ValidationSummary(true)

        <div>@Html.LabelFor(model => model.NewClub.NewClubName) <span class="required">&#42;</span></div>
        @Html.EditorFor(model =>model.NewClub.NewClubName)
        @Html.ValidationMessageFor(model => model.NewClub.NewClubName)


        <div>
            @Html.LabelFor(model => model.ClubTypes) <span class="required">&#42;</span>
        </div>

        @Html.DropDownListFor(model => model.ClubTypes, Model.ClubTypes)
        @Html.ValidationMessageFor(model => model.ClubTypes)

        <p>
            <input type="submit" name="submit" value="Submit" class="btn"/> <input type="reset" name="reset" value="Cancel" class="btn ltgrey" /> 
        </p>
    }
</div>

ここに問題の実例があります：

4

4 に答える 4

10

スパンを<label></label>

<div>
    <label for="NewClub_NewClubName">Name your club <span class="required">*</span></label> 
</div>

margin必要に応じて左に移動するように設定できます。

例

更新されたフィドル

アップデート

あなたが使用して@LabelFor()いるので、これをあなたのラベルに渡してください：

display:inline;

于 2013-10-17T15:02:44.067 に答える
2

HTML をいじることができなくても、CSS をいじることができる場合>

label{display:inline; clear:both;}

これはすべてのラベルに影響するため、注意してください...

于 2013-10-17T15:06:52.640 に答える
1

プレーンな HTML5 および CSS3 では、次のルールを使用できます。これを ASP.net に変換する方法がわかりません:

.required:after {
    content: "*";
}

次に、HTMLを次のように記述します

<div>
    <label for="NewClub_NewClubName" class="required">Name your club.</label>
    <input ...>
</div>

一方、requiredASP に変換する方法がわからない HTML5 属性を使用できます。ではplaceholder、ラベルが必要ない場合があります。

<div>
    <input type="text" name="newClub" placeholder="New club name" required/>
</div>

これは、疑似クラスを使用してスタイルできます:required。CSS3隣接セレクターを使用できるように後でラベルを付ける場合は、次を試すこともできます。

<div>
    <input type="text" id="newClub" name="newClub"
        placeholder="New club name" required/>
    <label for="newClub">New club name.</label>
</div>

と

input:required + label:before {
    content: "*";
    color:   red;
}

繰り返しになりますが、私は ASP を知りません。

于 2013-10-17T15:32:12.720 に答える
0

これを試して

    ＃始めましょう {
        オーバーフロー:非表示;
    }
    #letsgetStarted ラベル {
        フロート:左;
        幅:自動;
    }
    #letsgetStarted span.required {
        フロート:左;
    }

HTML テキストを label タグ内に配置します。私はそれを試しませんでした。それはあなたのために働くはずです。

于 2013-10-17T15:13:02.907 に答える