Angular/CSS：不采取格式

Question

我很惊讶我的格式不被接受。如果我在索引中并在那里添加

<main role="main" class="container-fluid">
...
</main>

然后我的设计正确显示并且“ABC”在右侧。 但是如果我将它移到 app.component.html，那么格式似乎被歪曲了。 起初我以为这可能是以下问题，但display:block; 并没有解决它：

Bootstrap style not working against Angular2 components

问题案例：

https://stackblitz.com/edit/angular-lnutdw

Answer 1

当您将<main> 标签移动到组件中时，它也会被索引中的<my-app> 父标签包装。该类被正确应用，只是父标签使它看起来不像你想要的那样。

将my-app 设置为具有width: 100% 以使其成为全宽或将container-fluid 类添加到my-app 元素。