css - Angular w/Flexbox app-root 不是 100% 宽

Question

我正在尝试使用带有 Flexbox 的 Angular 7。

准确地说是 bool 玛。

我的 app-root 组件不是 100% 宽。我怎样才能正确地实现这一目标？

我的 styles.scss 看起来像

@import "./variables";
@import "~bulma";
html,
body {
    height: 100%;
}

body {
    display: flex;
}

app-root {
    height: 100%;
    width: 100%;
}

这可行，但是我不确定以这种方式使用 app-root 是否正确。

Answer 1

你有app.component.scss文件吗？

您可以添加它，它应该正确定位该组件。

:host {
    width: 100%;
    height: 100%;
}

:host 用于定位托管元素(例如 )。