Html 自举btn组高度_Html_Css_Twitter Bootstrap 3

Html 自举btn组高度

html css twitter-bootstrap-3

Html 自举btn组高度,html,css,twitter-bootstrap-3,Html,Css,Twitter Bootstrap 3,test.html <html> <head> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" type="t

test.html

<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css" />
    <link rel="stylesheet" type="text/css" href="css/bootstrap-theme.min.css" />

</head>
<body>
    <div class="col-md-12">
        <table>
            <tr>
                <div class="col-md-3">
                    <label>Min: <span data-toggle="tooltip" data-placement="bottom" data-html="true" title="" class="glyphicon glyphicon-info-sign glyphiconFormButton"></span></label>
                    <div class="input-group">
                        <span class="input-group-btn">
                            <button type="button" class="btn btn-danger btn-number"  data-type="minus" data-field="question[nr][text][min]">
                                <span class="glyphicon glyphicon-minus"></span>
                            </button>
                        </span>
                        <input type="text" name="question[nr][text][min]" class="form-control input-number" value="5" min="1" max="50">
                        <span class="input-group-btn">
                            <button type="button" class="btn btn-success btn-number" data-type="plus" data-field="question[nr][text][min]">
                                <span class="glyphicon glyphicon-plus"></span>
                            </button>
                        </span>
                    </div>
                </div>
                <div class="col-md-3">
                    <label>Max: <span data-toggle="tooltip" data-placement="bottom" data-html="true" title="" class="glyphicon glyphicon-info-sign glyphiconFormButton"></span></label>
                    <div class="input-group">
                        <span class="input-group-btn">
                            <button type="button" class="btn btn-danger btn-number"  data-type="minus" data-field="question[nr][text][max]">
                                <span class="glyphicon glyphicon-minus"></span>
                            </button>
                        </span>
                        <input type="text" name="question[nr][text][max]" class="form-control input-number" value="30" min="10" max="50">
                        <span class="input-group-btn">
                            <button type="button" class="btn btn-success btn-number" data-type="plus" data-field="question[nr][text][max]">
                                <span class="glyphicon glyphicon-plus"></span>
                            </button>
                        </span>
                    </div>
                </div>
                <div class="col-md-1">
                    <button class="btn btn-danger" type="button" onClick="deleteQuestion()">Remove</button>
                </div>
            </tr>
        </table>
    </div>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
    <script src="js/bootstrap.min.js"></script>
</body>


最小值：
最大值：
去除

所有这些都包括我从那里得到的：和文件夹dist

为什么按钮“-”和“+”与输入字段的高度不同

如果我可以问第二个问题，如何将“删除”按钮与“-”，输入“+”，放在同一行中。

更新：

我看到相应的按钮大小为14x20，我的是14x14，但为什么？

我没有看到您的

和

按钮有问题。
第二个问题，因为

输入

有

标签

！快速修复，将

填充顶部

添加到

删除按钮

：

<div class="col-md-1 custom">
  <button class="btn btn-danger" type="button" onClick="deleteQuestion()">Remove</button>
</div>

.custom {
  padding-top: 26px;
}


去除
.习俗{
填充顶部：26px；
}

在jsfiddle中，我将

md

-类更改为

xs

-类以使用小屏幕，请将其更改回您的小屏幕

我没有发现您的

和

按钮有问题。
第二个问题，因为

输入

有

标签

！快速修复，将

填充顶部

添加到

删除按钮

：

<div class="col-md-1 custom">
  <button class="btn btn-danger" type="button" onClick="deleteQuestion()">Remove</button>
</div>

.custom {
  padding-top: 26px;
}


去除
.习俗{
填充顶部：26px；
}

在jsfiddle中，我将

md

-类更改为

xs

-类以使用小屏幕，请将其更改回您的小屏幕

您的代码对我来说运行良好-在您的代码示例中添加按钮

删除

，但我不理解这个“内联”问题：0您对特定的broswer有问题吗？与FF配合使用效果良好。也许这可能是css冲突，但是您应该检查整个DOM层次结构和css。你可能有什么东西在呼吸。@Anonymous我更改了主代码。它仍然返回与图像上相同的结果。有什么问题吗？您的代码对我来说运行良好-在您的代码示例中添加按钮

remove

，但我不理解这个“内联”问题：0您对特定的broswer有问题吗？与FF配合使用效果良好。也许这可能是css冲突，但是您应该检查整个DOM层次结构和css。你可能有什么东西在呼吸。@Anonymous我更改了主代码。它仍然返回与图像上相同的结果。怎么了？创建自己的

类是个好方法！您知道it类的含义，可以在需要时增加或减少it类。我这样做，如果我知道更好的解决办法，我会说的！创建自己的类
是一个好方法！您知道it类的含义，可以在需要时增加或减少it类。我这样做，如果我知道更好的解决办法，我会说的！