0

面白いことに、送信ボタンは入力ボックスに固定されています。理由がわかりませんでした。-（マイナス）マージンなどで解決できますが、恒久的な解決策を探しています。Chromeのデバッグツールのスクリーンショットを添付しました。

ここに画像の説明を入力してください

ボタンを選択ボックスの下の左に揃えたい。

画像が見づらい場合は...

http://i.stack.imgur.com/VhJVb.png

                        <input class="reservationdates"  type="text" name="date_from"/>
                        <label>Drop-off date</label>
                        <select name="to_time" class="reservationdates">
                            <option value="07:00 am">07:00 AM</option>
                            <option value="07:30 am">07:30 AM</option>
                            <option value="08:00 am">08:00 AM</option>
                            <option value="08:30 am">08:30 AM</option>
                            <option value="09:00 am">09:00  AM</option>
                            <option value="09:30 am">09:30 AM</option>
                            <option value="10:00 am">10:00 AM</option>
                            <option value="10:30 am">10:30 AM</option>
                            <option value="11:00 am">11:000 AM</option>
                            <option value="11:30 am">11:30 AM</option>
                            <option value="12:00 pm">12:00 PM</option>
                            <option value="12:30 pm">12:30 PM</option>
                            <option value="01:00 pm">01:00 PM</option>
                            <option value="01:30 pm">01:30 PM</option>
                            <option value="02:00 pm">02:00 PM</option>
                            <option value="02:30 pm">02:30 PM</option>
                            <option value="03:00 pm">03:00 PM</option>
                            <option value="03:30 pm">03:30 PM</option>
                            <option value="04:00 pm">04:00 PM</option>
                            <option value="04:30 pm">04:30 PM</option>
                            <option value="05:00 pm">05:00 PM</option>
                            <option value="05:30 pm">05:30 PM</option>
                            <option value="06:00 pm">06:00 PM</option>
                            <option value="06:30 pm">06:30 PM</option>
                        </select>


                        <div class="input-append date" id="dp3" data-date="12-02-2012" data-date-format="dd-mm-yyyy">
                            <input class="span2"  name="date_to" size="16" type="text" value="12-02-2012" readonly>
                            <span class="add-on"><i class="icon-th"></i></span>
                        </div>


                        <input class="span3 btn btn-large btn-primary" type="submit" name="submit" value="Search For Rates"/>

                    </form>
4

2 に答える 2

0

私の知る限り、入力ボックスを送信ボタンから分離するには、ブートストラップは「form-action」クラスを使用します。これにより、withボタンにパディングとマージンが追加されます。ですから、マージンを与えるというあなたの決定は、ある意味で正しいと思います。送信ボタンをに入れてみてください。しかし、私は間違っている可能性があります。

于 2012-05-04T16:56:10.553 に答える
0

.control-groupブートストラップのクラスを使用して、入力ボタンの入力フィールドを2つの行に分けることができます 。そのクラスは、入力フィールドからボタンを外す必要があるdivの下部にマージンを追加します。

デモ： http： //jsfiddle.net/MYjzj/

HTML

<form class="form-horizontal">
    <div class="control-group">
        <input class="reservationdates"  type="text" name="date_from"/>
        <label>Drop-off date</label>
        <select name="to_time" class="reservationdates">
            <option value="07:00 am">07:00 AM</option>
            <option value="07:30 am">07:30 AM</option>
            <option value="08:00 am">08:00 AM</option>
            <option value="08:30 am">08:30 AM</option>
            <option value="09:00 am">09:00  AM</option>
            <option value="09:30 am">09:30 AM</option>
            <option value="10:00 am">10:00 AM</option>
            <option value="10:30 am">10:30 AM</option>
            <option value="11:00 am">11:000 AM</option>
            <option value="11:30 am">11:30 AM</option>
            <option value="12:00 pm">12:00 PM</option>
            <option value="12:30 pm">12:30 PM</option>
            <option value="01:00 pm">01:00 PM</option>
            <option value="01:30 pm">01:30 PM</option>
            <option value="02:00 pm">02:00 PM</option>
            <option value="02:30 pm">02:30 PM</option>
            <option value="03:00 pm">03:00 PM</option>
            <option value="03:30 pm">03:30 PM</option>
            <option value="04:00 pm">04:00 PM</option>
            <option value="04:30 pm">04:30 PM</option>
            <option value="05:00 pm">05:00 PM</option>
            <option value="05:30 pm">05:30 PM</option>
            <option value="06:00 pm">06:00 PM</option>
            <option value="06:30 pm">06:30 PM</option>
        </select>
        <div class="input-append date" id="dp3" data-date="12-02-2012" data-date-format="dd-mm-yyyy">
            <input class="span2"  name="date_to" size="16" type="text" value="12-02-2012" readonly /><span class="add-on"><i class="icon-th"></i></span>
        </div>
    </div>
    <input class="span3 btn btn-large btn-primary" type="submit" name="submit" value="Search For Rates"/>
</form>
于 2012-05-09T16:14:16.583 に答える