无法在 Laravel 中获得完整的输入宽度答案

【问题标题】：Can't get the full width of input in Laravel无法在 Laravel 中获得完整的输入宽度
【发布时间】：2016-02-11 05:10:12
【问题描述】：

我正在努力将我的引导模板扩展到我的 laravel 项目中。我的输入宽度有问题。在我的项目中，我无法在我的列中获得全宽度的输入。唯一的区别是我的 laravel 项目中的形式。我该如何解决这个问题？

我的引导 HTML（工作）：

<div class="row">
  <div class="col-lg-2"></div>
  <div class="col-lg-8">
    <div class="input-group">
      <input class="form-control" type="text" placeholder="Search for...">
      <span class="input-group-btn">
        <input class="btn btn-secondary" type="submit" value="Short Url">
      </span>
    </div>
  </div>
  <div class="col-lg-2"></div>
  </div>

我在 Laravel 中的模板（输入没有全宽）：

<div class="row">
  <div class="col-lg-2"></div>
  <div class="col-lg-8">
    <div class="input-group">
      <form class="navbar-form" accept-charset="UTF-8" action="http://localhost:8000" method="POST">
      <input type="hidden" value="C5RbH20lMX79fI8TuI4SkVKu6QPQEyw2QgSDGOQc" name="_token">
      <input class="form-control" type="text" value="Enter your adress" name="url">
      <span class="input-group-btn">
      </form>
    </div>
  </div>
  <div class="col-lg-2"></div>
</div>

【问题讨论】：

标签： html css twitter-bootstrap laravel

【解决方案1】：

您需要将<form> 放在.input-group 之外

HTML

<div class="row">
    <div class="col-lg-2"></div>
    <div class="col-lg-8">
        <form class="navbar-form" accept-charset="UTF-8" action="http://localhost:8000" method="POST">
            <div class="input-group">
                <input type="hidden" value="C5RbH20lMX79fI8TuI4SkVKu6QPQEyw2QgSDGOQc" name="_token">
                <input class="form-control" type="text" value="Enter your adress" name="url"> <span class="input-group-btn">
        <input class="btn btn-secondary" type="submit" value="Short Url">
      </span>

            </div>
        </form>
    </div>
    <div class="col-lg-2"></div>
</div>

DEMO HERE

【讨论】：