如何将边距或css类应用于Angular 2组件？

假设我有一个组件，我想应用一些边距，最好通过引导助手类，例如mt-3应用顶部边距。当我在组件上指定它们时，如下所示：

<my-custom-input 
   required 
   class="mt-3" 
   name="usr" 
   label="User" 
   placeholder="Please enter username" 
   [(ngModel)]="username">
</my-custom-input>

class=“mt-3”

没有任何作用！通过Chrome开发工具手动设置边距也是不可能的。。。我猜是因为

mycustominput

不是预定义的HTML元素（比如

div

），它不能定义边距

---

在任何应用程序中，这似乎都是非常琐碎的事情，但我很惊讶到目前为止我还没有找到答案。我们如何重新定位这样的组件？至少，在父级（而不是组件模板内部）指定边距似乎是需要的关键

给它一个

显示：block在css中
我的自定义输入对类做了什么？我的自定义输入中有更多HTML元素？@eyalchen是
我的自定义输入
确实有一个div，该div中有更多嵌套内容。看起来我们需要将
显示
属性设置为宿主元素。看起来也像是
display:flex
工作。如果有人能解释为什么需要这样做，这将是有用的。这个答案应该有更多的选票。我花了好几天才找到解决办法。