1 Discussione di Katryne

  • Katryne
  • Katryne
  • Moderator
  • Offline
  • Da: Revest en Provence
  • Registrato: 30/05/2016
  • Messaggi: 961

Discussione: flex-direction:column

Hello Ale !
Sur le site de test pour John, j'ai déplacé des boîtes vers le bas pour faire place à la grande photo.
Mes 2 boîtes Engagements et Prestations qui se trouvaient en row 4 se retrouvent en row7.

J'avais spécifié que en dessous de 600 px de large, l'alignement devait se faire en colonne et pas en rangée. Mais je n'arrive pas à reproduire en row 7 ce qui existait en row 4. Pourquoi ? Peux-tu m'aider ?

Voici mon code css

@media all and (max-width: 600px) {div#toprow1 .wrapper, div#toprow2 .wrapper, div#toprow3 .wrapper, div#toprow4 .wrapper, div#toprow7.wrapper  {flex-direction: column;}}

http://john.chauvigne.info/

Katryne : Website

2 Risposta di Penanders

  • Penanders
  • Administrator
  • Offline
  • Da: Italia / Roma
  • Registrato: 28/05/2016
  • Messaggi: 795

Re: flex-direction:column

Peux tu remettre les boites comme tu as écrit dans le post?

3 Risposta di Katryne

  • Katryne
  • Katryne
  • Moderator
  • Offline
  • Da: Revest en Provence
  • Registrato: 30/05/2016
  • Messaggi: 961

Re: flex-direction:column

Voilà, mes boîtes 10 et 11 sont de retour en row4. Et elles se mettent bien en colonne en dessous-de 600px.

Katryne : Website

4 Risposta di Penanders

  • Penanders
  • Administrator
  • Offline
  • Da: Italia / Roma
  • Registrato: 28/05/2016
  • Messaggi: 795

Re: flex-direction:column

Je n'arrive pas a comprendre ce que tu souhaites... une image m'aiderait mieux peut-être

5 Risposta di Katryne

  • Katryne
  • Katryne
  • Moderator
  • Offline
  • Da: Revest en Provence
  • Registrato: 30/05/2016
  • Messaggi: 961

Re: flex-direction:column

Pour bien voir il faut visionner les 2 sites de John, le site vivant et le site de test, en diminuant chaque fois la largeur d'écran en-dessous de 600px.

Les 2 boîtes 10 et 11 sont sur la rangée 4 sur le site de test et sur la rangée 7 sur le site en production Et je n'ai pas le même résultat. Je veux que les boîtes s'affichent une à côté de l'autre au-dessus de 600px et une en-dessous-de l'autre pour les écrans inférieurs à 600px de large.

En petite largeur, voilà pour le site de test, boîtes sur la rangée 4

https://image.prntscr.com/image/ycCJM3YLSXuGig7HrW0E0A.png

Et voilà pour le site en production, boîtes sur la rangée 7 :

https://image.prntscr.com/image/1SusePFXSCufwfHm8YllWQ.png

Site de test : http://john.chauvigne.info/
Site en production : http://vtc-ccc.com/

Katryne : Website

6 Risposta di Penanders

  • Penanders
  • Administrator
  • Offline
  • Da: Italia / Roma
  • Registrato: 28/05/2016
  • Messaggi: 795

Re: flex-direction:column

essaie avec 

flex-direction: column;

à la ligne 84 de ton fichier css sur le site en production wink

7 Risposta di Katryne

  • Katryne
  • Katryne
  • Moderator
  • Offline
  • Da: Revest en Provence
  • Registrato: 30/05/2016
  • Messaggi: 961

Re: flex-direction:column

Ah, c'était le bon code, mais pas à cet endroit, il le faut dans les media-queries. C'est bon maintenant, merci merci.

Katryne : Website