[Résolu] Grille

Bonjour,
j'essai de refaire mon site en responsive simplement (oops !), et j'ai fait une grille de 12 colonnes avec comme code.
.container {
display: grid;
grid-template-columns: repeat(12, 1fr);
margin-right: auto;
margin-left: auto;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
J'ai fait un header et un footer de 12 colonnes, un aside de 3 et un main de 9 en simplifié, sachant que le main contient texte et images :
header {
grid-column: 1/ span 12;
}
aside {
grid-column: 1/ span 3;
}
main {
grid-column: 4/ span 9;
}

footer {
grid-column: 1/ span 12;
}
OK. Je voudrais maintenant améliorer l'ensemble et positionnant selon des blocks de 1 à plusieurs colonnes dans le main et je n'arrive pas à trouver quelque chose de simple pour les positionner.
Quelqu'un peut-il m'aider ?
Merci

Je tiens à préciser que j'ai aussi comme code :

.container [class*="grid-"] {
  float: left;
  width: 8.33333%;
  min-height: 1px; }
.container .grid-1 {
  width: 8.33333%; }
.container .grid-2 {
  width: 16.66667%; }
......

Quand je fais :
<div class="row">
<div class="grid-2">…<div>
<div class="grid-2">...<div>
<div>
cela me met bien les tailles,mais les positionnent les uns sous les autres et non pas les uns à côté des autres. Je ne sais alors comment définir le .row
J'ai essayé d'être plus précis
Merci