css - Twitter Bootstrap : how to set width of form fields in . 表单内联？

Question

在 .form-inline 中，如何使文本输入字段变宽？我似乎不能可靠地使用 .row 和 .col-md-* 等。我只需要我的文本输入更宽。这是我的片段:http://www.bootply.com/ddGvJH99Ud

<div class="container-fluid">
    <div class="row well">
        <div class="col-xs-12 col-sm-12 col-md-11 col-md-offset-1">
            <form class="form-inline">

                <div class="form-group">
                    <label for="search-domain">Search</label>
                    <select class="form-control" name="search-domain" id="search-domain">
                        <option value="books">
                            Books
                        </option>
                    </select>
                </div>

                <!-- START: Book Search Fields -->
                <div class="form-group search-books">
                    <label for="search-books-keywords">for</label>
                    <input type="text" class="form-control" placeholder="e.g.: title, author, ISBN, or keywords..." name="search-books-keywords" id="search-books-keywords">
                </div>
                <!-- END: Book Search Fields -->

                <button class="btn btn-success" type="button">Go</button>

            </form>
        </div>
    </div>
</div>

Answer 1

您可以为输入设置规则，例如:

#search-books-keywords {
  width:500px;
}

bootply example