Question

我想让输入与模态的宽度相同。目前在＆＃34; md＆＃34;适合模态，但一旦屏幕扩展到＆＃34; lg＆＃34;输入缩小到模态大小的一半。我正确使用col-lg-12吗？

    <form class="form-horizontal" action="" method="post">
    <fieldset>
    <legend class="text-center">Contact me</legend>

    <!-- Name input-->
    <div class="form-group">
      <label class="col-md-3 control-label" for="name">Name</label>
      <div class="col-md-9 col-lg-12">
        <input id="name" name="name" type="text" placeholder="Your name" class="form-control">
      </div>
    </div>

    <!-- Email input-->
    <div class="form-group">
      <label class="col-md-3 control-label" for="email">Your E-mail</label>
      <div class="col-md-9 col-lg-12">
        <input id="email" name="email" type="text" placeholder="Your email" class="form-control">
      </div>
    </div>

    <!-- Message body -->
    <div class="form-group">
      <label class="col-md-3 control-label" for="message">Your message</label>
      <div class="col-md-9 col-lg-12">
        <textarea class="form-control" id="message" name="message" placeholder="Please enter your message here..." rows="5"></textarea>
      </div>
    </div>
    <div class="modal-footer">
    <!-- Form actions -->
    <div class="form-group">
      <div class="col-md-12 text-right">
        <button type="submit" class="btn btn-default btn-md">Close</button>
        <button type="submit" class="btn btn-primary btn-md">Submit</button>
      </div>
    </div>
    </div>
  </fieldset>
  </form>

Answer 1

看看这个。 LINK

另请注意<div class="col-md-9 col-lg-12">行更改为<div class="col-md-12 col-lg-12">

随着屏幕扩展，Bootstrap形式缩小。

1 个答案: