View on GitHub

Web Projects

Compilations of various Web Projects and Notes on JS, jQuery, CSS, Aframe, ThreeJS, WebXR

Vertically Divided Elements

Output

Sample Output

Code Structure

<div class="container">
    <div class="leftContainer">Left Container</div>
    <div class="rightContainer">Right Container</div>
</div>
* {
    margin: 0;
    color: white;
    font-family: monospace;
}

.container {
    background-color: black;
    display: grid;
    /* grid-auto-flow: column; */
    grid-template-columns: auto auto;
    min-height: 100vh;
}

.leftContainer {
    background-color: orange;
}

.rightContainer {
    background-color: black;
}

Click this link to view above example in action