Discussion :

[MinceNico]

Bonjour,

Je commence un nouveau squelette de site avec bootstrap (je débute). Je n'arrive pas à faire un système très simple : 2 colonnes pour taille d'écran tablette et plus, et 1 colonne pour le mobile.
La subtilité est au niveau de l'agencement des éléments (voir l'image ci-dessous) : je souhaite qu'en mobile, "col g-L-2" soit en dessous de "col d-L1".

Je n'arrive pas à le faire, avez-vous une idée?

Code HTML :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
		<div class="row">
			<div class="col-md-3">
				gauche
				<div class="row">
					<div class="col-12 order-1" style="background-color:green;">
						col g-L-1
					</div>
					<div class="col-12 order-3" style="background-color:red;">
						col g-L-2
					</div>
				</div>
			</div>
			<div class="col-md-9">
				droite
				<div class="row">
					<div class="col-12 order-2" style="background-color:yellow;">
						col d-L1
					</div>
				</div>
			</div>
		</div>

Par avance merci,