spacing between form fields

前端 未结 4 1892
星月不相逢
星月不相逢 2021-01-07 04:32

I have an HTML form element:

Name
相关标签:
4条回答
  • 2021-01-07 05:06

    I would wrap your rows in labels

    <form action="doit" id="doit" method="post">
        <label>
            Name
            <input id="name" name="name" type="text" />
        </label>
        <label>
            Phone number
            <input id="phone" name="phone" type="text" />
        </label>
        <label>
            Year
            <input id="year" name="year" type="text" />
        </label>
    </form>
    

    And use

    label, input {
        display: block;
    }
    
    label {
        margin-bottom: 20px;
    }
    

    Don't use brs for spacing!

    Demo: http://jsfiddle.net/D8W2Q/

    0 讨论(0)
  • 2021-01-07 05:09

    In your CSS file:

    input { margin-bottom: 10px; }
    
    0 讨论(0)
  • 2021-01-07 05:13
      <form>     
                <div class="form-group">
                    <label for="nameLabel">Name</label>
                    <input id="name" name="name" class="form-control" type="text" /> 
                </div>
                <div class="form-group">
                    <label for="PhoneLabel">Phone</label>
                    <input id="phone" name="phone" class="form-control" type="text" /> 
                </div>
                <div class="form-group">
                    <label for="yearLabel">Year</label>
                    <input id="year" name="year" class="form-control" type="text" />
                </div>
            </form>
    
    0 讨论(0)
  • 2021-01-07 05:29

    A simple &nbsp; between input fields would do the job easily...

    0 讨论(0)
提交回复
热议问题