Content split

V000-31

Een preset om de standaard content te splitten in 2 kolommen.

Hoe te gebruiken?

Kopieer en plak onderstaande code in je templates.

Voorvertoning

Alvast beginnen met een basis opmaak?

HTML
Kopiëren<div class="container">
	<div class="module-output-split">
		<nc-module-output></nc-module-output>
	</div>
</div>

CSS
Kopiëren.module-output-split,
.module-output-split div[data-partial="module-output"] {
	display: flex;
	flex-direction: column;
}

.module-output-split >*,
.module-output-split div[data-partial="module-output"] >* {
	flex-grow: 1;
}

@media only screen and (min-width: 992px) {
	.module-output-split,
	.module-output-split div[data-partial="module-output"] {
		flex-direction: row;
	}

	.module-output-split >*,
	.module-output-split div[data-partial="module-output"] >* {
		flex-basis: 50%;
	}
}