div内的Bootstrap额外填充

Question

我正在为我经常使用的网站实现用户脚本（在Tampermonkey中），并且试图在页面上添加div。如果我将div添加到页面顶部（添加到根元素），一切都很好：

但是，一旦我将其添加到Bootstrap列中，就会得到一些令人讨厌的额外填充，如下所示：

我尝试通过Chrome开发者工具摆弄样式，唯一使填充消失的方法是删除列中之前出现的所有元素，并在父元素中设置“：before”元素行到“ display：inline”。我认为我可能误会了Bootstrap的工作原理，并且可能有一个简单的解决方法，但是我已经尝试了一段时间，并且在网上进行搜索，但没有找到任何遇到类似问题的人。有谁知道导致填充问题的原因以及如何解决？

编辑：Bootstrap版本似乎是3.3.2（我无法对其进行更新，因为这是一个用户脚本），并且插入后的HTML如下所示（“下拉”元素就是我插入的元素）：

应用于“ project-dropdown”元素的CSS如下所示：

Answer 1

project-dropdown元素有一个父类col-x-x，它引入了左右填充。最重要的是，该列放在row类中，引入了顶部和底部填充。

由于 CSS 本身的性质，这些属性也将被子元素“继承”。要删除所有填充，请覆盖父col和row类的默认值。

干杯！