0

以下のjsfiddleがあります。メッセージ全体が正しく表示されるように、スパン内のエラーメッセージのスペースを増やす方法を知る必要があります。

JSFiddle

    <form method="post" action="" id="subscribeForm" name="subscribeForm">
        <fieldset>
            <label>Name: </label><input type="text" class="effect" name="name" id="name"  autocomplete="off" >
            <span id="nameInfo">What's your name?</span>
        </fieldset>

        <fieldset>
            <label>Email: </label><input type="text" class="effect" name="email" id="email"  autocomplete="off" >
            <span id="emailInfo">Valid E-mail please, you will need it to log in!</span>
        </fieldset>

        <div id="button">
            <input type="submit" value="Subscribe" name="subscribeForm"/>
        </div>
        <div id="success">
            <strong>Data Saved Successfully.</strong>
        </div>
    </form>

CSS コード

    #subscribeForm span.error{
                color: #e46c6e;
            }

            #subscribeForm input.error{
                background: #f8dbdb;
                border-color: #e77776;
            }

            #subscribeForm span.error{
                color: #e46c6e;
            }

            #subscribeForm span{
                margin-left: 50px;
                color: #b1b1b1;
                font-size: 11px;
                font-style: italic;
            }

JSFiddle

4

2 に答える 2