html - Bootstrap 3 Textarea with input-group-button 和 btn-group-vertical

标签 html css forms twitter-bootstrap-3

我正在使用 bootstrap 3,我有一个带有文本区域和两个按钮的表单。我想要的是将按钮与 btn-group-vertical 和 textarea 与带有 input-group-button 的按钮分组。

我的代码是这样的:

<form>
    <div class="input-group">
        <textarea class="form-control" rows="2" style="resize:none"></textarea>
        <span type="submit" class="input-group-addon btn btn-primary">Button 1</span>
        <span type="submit" class="input-group-addon btn btn-primary">Button 2</span>
    </div>
</form>

enter image description here

这个选项按钮保持这么大。

第二个选项:

<form>
    <div class="input-group">
        <textarea class="form-control" rows="2" style="resize:none"></textarea>
        <span class="input-group-addon">
            <span class="btn-group-vertical">
                <span type="submit" class="btn btn-primary">Button 1</span>
                <span type="submit" class="btn btn-danger">Button 2</span>
            </span>
        </span>
    </div>
</form>

enter image description here

我想要第二个选项,但没有灰色框和这个边距。

有人可以帮我吗?

最佳答案

在你的css文件中写入

.input-group-addon{
  padding: 0;
}

这将移除按钮周围的填充。

关于html - Bootstrap 3 Textarea with input-group-button 和 btn-group-vertical,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52338096/

相关文章:

html - 窗口大小改变时如何防止表列不重叠

javascript - 使用 HTML 和 CSS 时,如何将类应用到已经是只读的字段?

javascript - 提交处理程序仅在第二次尝试时起作用

javascript - HTML 自动播放视频并从文件夹继续循环

php - 用php获取内部html

python - 图片上传字段在 django admin 中有效,但在模板中无效

jQuery 在特定鼠标坐标处触发事件

php - 从带引号的表单调用 setTimeout

php - 使用sql INSERT将日期输入mysql数据库

jquery - JS fiddle : Making div occupy 100% height