Bootstrap - Criando adaptação móvel para padrão de linha reversa
Eu quero criar um efeito reverso com o Bootstrap (1ª linha: texto à esquerda, imagem à direita 2ª linha: Imagem à esquerda, texto à direita 3ª linha: Texto à esquerda, imagem à direita 4ª linha: Imagem à esquerda, texto à direita
E isso continua indefinidamente!
Parece muito bom em dispositivos grandes, mas quando é exibido no dispositivo, ele se adapta logicamente como se as fotos fossem uma após a outra!
Eu gostaria que os dispositivos móveis fossem sempre: Para cima = Texto, para baixo = imagem em vez de variações.
Aqui está o código para duas linhas:
<!-- FIRST ROW -->
<div class="row border-marine margin-bottom">
<div class="col-lg-6 text-center">
<h2 class="padding-bottom-large">Réfection de toiture</h2>
<p>Que ce soit un toit de bardeau, de tôle ou à faible pente, Toitures l & l saura
vous satisfaire</p>
</div>
<div id="no-padding" class="col-lg-6">
<img src="assets/img/toiture.png" class="img-responsive" alt="">
</div>
</div>
<!-- SECOND ROW -->
<div class="row border-marine margin-bottom">
<div id="no-padding" class="col-lg-6">
<img src="assets/img/ventilation.png" class="img-responsive" alt="">
</div>
<div class="col-lg-6 text-center">
<h2 class="padding-bottom-small">Ventilation de toiture</h2>
<p>Ayant effectué une centaine de travaux de ventilation de toiture, Toitures L & L
possède les connaissances et l'expérience nécessaire à l'aération de votre toiture.</p>
</div>
</div>
Como fica em um dispositivo de mídia grande
Como fica em um dispositivo móvel
Saúde Gente!!