csslayout/contents/split-screen.md

layout, title, description, keywords

layout	title	description	keywords
layouts/post.njk	Split screen	Create a split screen with CSS flexbox	css flexbox, css layout, css split screen

HTML

<div class="split-screen">
    <!-- Left content -->
    <div class="split-screen__half">
        ...
    </div>

    <!-- Right content -->
    <div class="split-screen__half">
        ...
    </div>
</div>

CSS

.split-screen {
    display: flex;
}

.split-screen__half {
    flex: 1;
}

{% demo %}{% include "covers/split-screen.njk" %}{% enddemo %}