Witam,

Próbuje swoich sił w Gridzie.
Mam pewien pewnie prosty problem.
Jak wprowadzić podział w wykonanym już regionie - zakładam podział layotu na sekcje ( w tym przypadku muszę podzielić stopkę z 4 regionów na 2, zaś te 2 na kolejne.
Chciałem to wykonać poprzez dodanie diva w divie - poniżej code :

<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<div class="container">
	<div class="item footer">
			<div class="item footerleft">
				<p>I'm the footer left</p>
			</div>
	</div>
</div>
</body>


<style>

.container {
	display: grid;
	grid-gap: 5px;
	grid-template-columns: 1fr 2fr 2fr 1fr;
	grid-template-rows: 445px auto auto 300px auto 445px;
	grid-template-areas:
		"o1 o1 o1 o1"
		"o2m o2 o3 o3m"
		"o23m o23 o32 o32m"
		"o4 o4 o4 o4"
		"o5m o5  o6 o6m" 
		"o7 o7 o7 o7" 

.footer {
	grid-area: o7;
	background: linear-gradient(-45deg, #fe6b83, #9326f0);	
}

</style>

</html>

Pytanie szczegółowe : stopka złożona jest z 4 regionów, w jaki sposób otrzymać możlwiośc umieszczenia treści w danym regionie - opcje start / stop nie chcą zbytnio działać...
Załóżmy że treść

 <p>I'm the footer</p>

Umieścimy tak naprawdę w "o7 o7(2 kolumna) o7 o7"