css - Twitter-bootstrap表单没有响应

我已经创建了此联系人，但是当我更改浏览器大小或通过单元格浏览它时，它似乎没有响应。
当我在单元格上打开它或调整浏览器窗口的大小时，输入区域变得比预期的要小。

我的代码：

<div class="container">
        <form class="well span8" action="" method="post">
        <div class="row">
            <div class="col-xs-4">
                <label>Name:</label>
                <input class="form-control" placeholder="Your Name" value="" type="text" name="name" required>

                <label>Email Address</label>
                <input class="form-control" placeholder="Your email address" value="" type="text" name="email" required>

                <label>Subject</label>
                <select class="form-control" id="subject" name="subject">
                    <option selected value="na">
                        Choose One:
                    </option>

                    <option value="query">
                        Query
                    </option>

                    <option value="suggestions">
                        Suggestions
                    </option>

                    <option value="advertise">
                        Advertise
                    </option>
                </select>
            </div>

            <div class="col-xs-5">
                <label>Message</label>
                <textarea class="form-control" required id="message" name="message" rows="10"></textarea>

        <div style="margin-top:10px" class="form-group">
            <button class="btn btn-primary pull-right" type="submit">Send</button>
            </div>


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

能否请您告诉我如何使它响应。

最佳答案

这是一种方法（多选一）

使用col-sm-xx代替col-xs-xx可获得更好的结果

Bootply：http://www.bootply.com/123382

HTML：

<div class="container">
        <form class="well col-sm-8 " action="" method="post">
        <div class="row">
            <div class="col-sm-4">
                <label>Name:</label>
                <input class="form-control" placeholder="Your Name" value="" type="text" name="name" required="">

                <label>Email Address</label>
                <input class="form-control" placeholder="Your email address" value="" type="text" name="email" required="">

                <label>Subject</label>
                <select class="form-control" id="subject" name="subject">
                    <option selected="" value="na">
                        Choose One:
                    </option>

                    <option value="query">
                        Query
                    </option>

                    <option value="suggestions">
                        Suggestions
                    </option>

                    <option value="advertise">
                        Advertise
                    </option>
                </select>
            </div>

            <div class="col-sm-5">
                <label>Message</label>
                <textarea class="form-control" required="" id="message" name="message" rows="10"></textarea>

        <div style="margin-top:10px" class="form-group">
            <button class="btn btn-primary pull-right" type="submit">Send</button>
            </div>


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

更新后的评论：

使用第一个col-sm-12代替col-sm/xs-8：

Bootply：http://www.bootply.com/123389

关于css - Twitter-bootstrap表单没有响应，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/22535050/