0

このタイトルを読んでいると、cssの同じ古い話を思い浮かべるかもしれませんが、同じではありません。テキストボックスがあり、プレースホルダープロパティを指定して、cssクラスを適用しました。次に、必須フィールドとしてマークするラベルを追加する必要があります。問題はcssが原因で、テキストボックスの右上隅にラベルを配置できません。

コードは次のとおりです。

<div id="formwrap">
        <div class="formarea">
            <p class="sub_headline">
                User Details</p>

            <asp:TextBox ID="txtFname" class="input" placeholder="First name" runat="server"></asp:TextBox>
            <asp:Label runat="server" Text="*" ForeColor="Red"></asp:Label><br />
            <asp:RequiredFieldValidator runat="server" ErrorMessage="Please Enter First name" ControlToValidate="txtFname" ></asp:RequiredFieldValidator>


</div>
</div>

cssコード：

.input
{
    font-family: 'Lato' , sans-serif;
    border: 1px solid #CCCCCC;
    width: 65%;
    height: 20px;
    margin: 14px 94px 0 0;
    font-size: 16px;
    font-weight: lighter;
    padding: 4px;
    color: #E96151;
    float: left;
}

どうすればそれを取り除くことができますか？

ありがとうございました。

4

3 に答える 3

2

テキストボックスの余白を削除するだけで機能します。

.input
{
    font-family: 'Lato' , sans-serif;
    border: 1px solid #CCCCCC;
    width: 65%;
    height: 20px;
    /*margin: 14px 94px 0 0;*/
    font-size: 16px;
    font-weight: lighter;
    padding: 4px;
    color: #E96151;
    float: left;
}

htmlコントロールにあるこのデモをご覧ください。cssクラスを編集したくない場合は、テキストボックスへの追加style="margin:0;"をオーバーライドしてください。

提案：プレースホルダーはhtml入力に対してのみ機能します。代わりに、以下のコードを使用できます。

      <asp:TextBox ID="txtFname" class="input" Text="First Name"
       onblur="if (this.value == '') {this.value = 'First Name';}" onfocus="if (this.value == 'First Name') {this.value = '';}" runat="server"></asp:TextBox>
于 2013-03-11T06:27:15.283 に答える
0

要素ごとに異なる親コンテナを作成する必要があります。そうすれば可能です。

<div id="formwrap">
    <div class="formarea">
        <p class="sub_headline">
            User Details</p>

        <asp:TextBox ID="txtFname" class="input" placeholder="First name" runat="server"></asp:TextBox>
        <div>
          <asp:Label runat="server" Text="*" ForeColor="Red"></asp:Label><br />
        </div>
        <div>
            <asp:RequiredFieldValidator runat="server" ErrorMessage="Please Enter First name" ControlToValidate="txtFname" ></asp:RequiredFieldValidator>
        </div>
     </div>  
</div>

スタイルを垂直方向に配置します

于 2013-03-11T06:17:18.863 に答える
0

この問題は、アプリケーションのUIを設計する際にHTMLテーブルを使用することで解決できます。

1つのHTMLテーブルを取得し、1つの列にテキストボックスを配置し、次の列の[Manditory*]を次のようにテキストボックスにラベル付けします>>

 <table class="style1">
        <tr>
            <td>
                <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
            </td>
            <td>
                <asp:Label ID="lblMantitory" runat="server" Text="*"></asp:Label>
            </td>
        </tr>

    </table>
于 2013-03-11T06:12:09.920 に答える