Responsive Design, comment changer l'ordre de div conteneurs?
Je commence tout juste avec le responsive webdesign. J'ai un 2 colonne mise en page (barre latérale et le contenu).
<div class="main-container">
<div class="main wrapper clearfix">
<div class="con1">
<header>
<h1>container 1 h1</h1>
<p>text1</p>
</header>
<section>
<h2>overview section h2</h2>
<p> test</p>
</section>
</div>
<div class="con2">
<header>
<h1>container 2 article header h1</h1>
<p></p>
</header>
<section>
<h2>article section h2</h2>
<p>text</p>
</section>
</div>
<aside>
<h3>aside</h3>
<p>text</p>
</aside>
</div> <!-- #main -->
</div> <!-- #main-container -->
Le contenu obtenu 2 div conteneur. Sur un petit écran, je veux
Div1
Div2
Sur un grand écran, je veux qu'ils sont inversées,
Div2
Div1
Dans mon CSS j'ai maintenant la suite des Requêtes de Média:
@media only screen and (min-width: 768px) {
.main div.con1 {
float: right;
width: 57%;
}
.main div.con2 {
float: right;
width: 57%;
}
Est-il possible de permuter l'ordre autour de et si oui, comment puis-je le faire? Quelqu'un a peut-être un lien vers un bon tuto?
Merci beaucoup d'avance !
double possible de l'Utilisation de CSS pour réorganiser les DIVs
OriginalL'auteur Luka | 2012-10-11
Vous devez vous connecter pour publier un commentaire.
La méthode utilisée dans le StackOverflow question "Positionnement CSS de la div au dessus d'un autre div lorsqu'il n'est pas dans cet ordre dans le code HTML" semble être votre meilleur pari.
OriginalL'auteur Ryan Gates
avec js:
}
OriginalL'auteur Matoeil