Blazor: サブコンポーネント deep:: スタイルの変更が無効です

材料

Blazor CSS の分離

簡単に言うと、外層にdivを追加する必要があり、divを追加しないと認識されません。

無効なコード

    <Layout ShowFooter="true" class="Layout" SideWidth="100px">
        <Header>
            <div class="text-center header">Header</div>
        </Header>
        <Side>
            <div class="text-center side">Side</div>
        </Side>
        <Main>
            <div class="text-center main">User</div>
        </Main>
        <Footer>
            <div class="text-center footer">Footer</div>
        </Footer>
    </Layout>

有効なコード

<div>
    <Layout ShowFooter="true" class="Layout" SideWidth="100px">
        <Header>
            <div class="text-center header">Header</div>
        </Header>
        <Side>
            <div class="text-center side">Side</div>
        </Side>
        <Main>
            <div class="text-center main">User</div>
        </Main>
        <Footer>
            <div class="text-center footer">Footer</div>
        </Footer>
    </Layout>
</div>