Twig, boucles for imbriqués afin d'afficher 2 éléments par ligne
Résolu/Fermé
Fontainard
Messages postés
68
Date d'inscription
dimanche 16 mars 2014
Statut
Membre
Dernière intervention
24 janvier 2017
-
Modifié par Fontainard le 21/07/2016 à 15:08
Fontainard Messages postés 68 Date d'inscription dimanche 16 mars 2014 Statut Membre Dernière intervention 24 janvier 2017 - 3 août 2016 à 11:16
Fontainard Messages postés 68 Date d'inscription dimanche 16 mars 2014 Statut Membre Dernière intervention 24 janvier 2017 - 3 août 2016 à 11:16
A voir également:
- Twig, boucles for imbriqués afin d'afficher 2 éléments par ligne
- Supercopier 2 - Télécharger - Gestion de fichiers
- Partager photos en ligne - Guide
- Aller à la ligne excel - Guide
- Vente en ligne particulier - Guide
- Photoshop elements gratuit - Télécharger - Retouche d'image
1 réponse
jubasse
Messages postés
24
Date d'inscription
mercredi 2 septembre 2015
Statut
Membre
Dernière intervention
11 octobre 2017
1
22 juil. 2016 à 10:38
22 juil. 2016 à 10:38
Salut,
je vois que tu utilise des classes bootstrap.
Alors au lieu de faire sa avec de l'algo, je te propose de faire ça à l'aide de ta mise en forme.
Alors le plus simple je pense est de créer un système de grille avec Bootstrap sachant que tu dispose de 12 colonnes par lignes.
Si tu veux 2 items par ligne il suffit de créer deux divs de 6 colonnes, ce qui te donnera 2 items par lignes.
par exemple :
Dans cet exemple dans tout les cas tu aura 2 items par lignes, si tu en veux trois alors (12 colonnes / 3 items par lignes = 4 colonnes par items) tu remplace les col-%%-6 par des col-%%-4.
md et lg : tailles standards d'écrans (desktop).
sm et xs : petites tailles d'écrans (mobile).
Tu peux même passer d'une grille de 3 items pour les très grands écrans à 2 pour les écrans moyens jusqu'a 1 pour les plus petits etc ...
Je pense que c'est la meilleur manière de procéder.
En espérant t'avoir aidé.
je vois que tu utilise des classes bootstrap.
Alors au lieu de faire sa avec de l'algo, je te propose de faire ça à l'aide de ta mise en forme.
Alors le plus simple je pense est de créer un système de grille avec Bootstrap sachant que tu dispose de 12 colonnes par lignes.
Si tu veux 2 items par ligne il suffit de créer deux divs de 6 colonnes, ce qui te donnera 2 items par lignes.
par exemple :
{% if elements %} <div class=row> {% for element in listelements %} <div class="col-md-6 col-sm-6 col-lg-6 col-xs-6"> <div class="pull-right"> {{element.id}} </div> </div> {% endfor %} </div> {% else %} {{ 'Pas d\'éléments' }} {% endif %}
Dans cet exemple dans tout les cas tu aura 2 items par lignes, si tu en veux trois alors (12 colonnes / 3 items par lignes = 4 colonnes par items) tu remplace les col-%%-6 par des col-%%-4.
md et lg : tailles standards d'écrans (desktop).
sm et xs : petites tailles d'écrans (mobile).
Tu peux même passer d'une grille de 3 items pour les très grands écrans à 2 pour les écrans moyens jusqu'a 1 pour les plus petits etc ...
Je pense que c'est la meilleur manière de procéder.
En espérant t'avoir aidé.
3 août 2016 à 11:16