Question

我有一个输入类型按钮并且正在使用引导程序，但是我的页面上的按钮显示得很宽，我真的不明白为什么。我也在使用刀片和laravel。我使用刀片打开表单（不确定是否会影响它）。

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<link rel="stylesheet" href="http://getbootstrap.com/dist/css/bootstrap.css">


</head>

<body>

<div class="container">
    <div>
        <label for="singleSelect"> Single select: </label><br>
        <div>
            <select class="col-xs-1" name="singleSelect" ng-model="data.singleSelect" ng-options="cat.id as cat.name for cat in selectOptions" ng-change="change(data.singleSelect)">
            </select>
            <input type="button" value="back" ng-click="upOneLevel()" class="btn btn-default col-xs-11"/>
        </div>
    </div>

</div>


</body>
</html>

我在我的网站上使用相同的html，并在jsfiddle上使用bootstrap，它看起来不错，但在我的屏幕上看起来像

后退按钮很大。我希望它看起来像它在小提琴中的作用如下：

任何想法？如果这会影响任何事情，我也在使用jquery和rateit2。

我的表单的所有输入字段看起来都太宽了

这是在朱利奥的建议之后

Answer 1

将班级col-xs-1设置为select元素，将col-xs-11设置为输入。

代码：

<div>
    <label for="singleSelect"> Single select: </label><br>
    <div class="container-small">
        <select class="col-xs-1" name="singleSelect" ng-model="data.singleSelect" ng-options="cat.id as cat.name for cat in selectOptions" ng-change="change(data.singleSelect)">
        </select>
        <input value="back" ng-click="upOneLevel()" class="btn btn-default col-xs-11" type="button">
    </div>
</div>

示例：http://www.bootply.com/DfPLcL7GKv

为什么使用bootstrap按钮太宽？

1 个答案: