How to remove white spaces inside the MainLayout Body?

Hi,

I am relatively new to Blazor, CSS, and most especially Radzen..and just after exploring <RadzenBody> and dark.css for my stylesheet..I can't seem to remove the white spaces below <RadzenBody>.

(please see image below)

This is how my code looks like:

<RadzenDialog />
<RadzenNotification />
<RadzenTooltip />
<RadzenContextMenu />

<RadzenHeader>
    <ChildContent>
        <div class="row justify-content-start align-items-center">
            <div class="col-6 d-flex align-items-center">
                <RadzenSidebarToggle Click="@SidebarToggleClick" />
                <RadzenLabel Text="TestRadzen" />
            </div>
            <div class="col-6 text-right">
            </div>
        </div>
    </ChildContent>
</RadzenHeader>
<RadzenBody @ref="body">
    <ChildContent>
        <RadzenContentContainer Name="main">
            @Body
        </RadzenContentContainer>
    </ChildContent>
</RadzenBody>
<RadzenSidebar @ref="sidebar">
    <ChildContent>
        <RadzenPanelMenu style="height: 100%">
            <ChildContent>
                <!-- add items here -->
            </ChildContent>
        </RadzenPanelMenu>
    </ChildContent>
</RadzenSidebar>
<RadzenFooter>
    <ChildContent>
        <RadzenLabel Text="TestRadzen, Copyright Ⓒ 2021" />
    </ChildContent>
</RadzenFooter>

@code {
    RadzenSidebar sidebar;
    RadzenBody body;

    private void SidebarToggleClick()
    {
        sidebar.Toggle();
        body.Toggle();
    }
}

Can anybody please help me correct my code?

Hi @gac,

Although I am not 100% sure what this is it looks to be the <html> element. The content of the body is not heigh enough to occupy the whole space. You can set the background color of the html via css to match the one of the body. Use your browser's developer tools to inspect the background of the body.