28172 sujets

CSS et mise en forme, CSS3

[Résolu] KNACSS, grid5

Bonjour à tous et merci d'avance pour votre aide.

J'utilise KNACSS depuis un moment déjà, j'ai installer la nouvelle version hier.
Mais j'ai un soucis avec le module .grid qui semble-t-il a subit des modifications.

J'aimerais aligné 5 élément <li> cote à cote.
Hors KNACCS fait basculer les derniers <li> en dessous des trois premiers.


         <div class="grid">
                <ul class="grid5">
                       <li>...</li>
                       <li>...</li>
                       <li>...</li>
                       <li>...</li>
                       <li>...</li>
                </ul>
            </div>


Merci à vous,
Modifié par Rifton007 (28 Feb 2015 - 18:28)
Quelque chose m'échappe alors.

Quand le viewport est plus grand, KNACSS place les <il> sur deux lignes.
Et quand je le reduit, ils les placent en une seule ligne.
Cela devrait être l'inverse, non ?

upload/19785-grid5notok.PNG
upload/19785-grid5ok.PNG
Modifié par Rifton007 (01 Mar 2015 - 13:38)
Ah effectivement, désolé je n'avais pas bien testé, vous aviez raison. C'est bien lié à KNACSS Il faudrait remonter le problème à l'équipe. En attendant vous pouvez ajouter ceci dans vos feuilles de style pour surcharger le comportement indésirable :
body .grid5 >* { width: 20%; }
Merci, cela m'a permis de régler le probléme.
Voici le résultat:
upload/19785-grid5001.PNG

Par contre en réduisant la taille de fenêtre, j'obtient ceci.
upload/19785-grid5002.PNG

Et si je réduit encore plus la taille j'obtient le résultat voulu.
upload/19785-grid5003.PNG

J'ai déclarer un min-width pour éviter l'étape intermédiaire, mais cela n'a eu aucun effet.
Tu prévois de rapporter le problème à l'équipe KNACASS ou tu veux que je le fasse ?
Encore merci à toi,
Je veux bien que tu t'en occupes j'ai pas trop le temps aujourd'hui. Pour le problème de responsive tu peux ajouter cette règle :
@media (max-width: 800px) {
    body .grid5 > * {
        width: 100%;
    }
}
En mettant à la place de 800px la taille a partir de laquelle tu veux que les éléments passent sur une colonne.
Bonne continuation Smiley cligne
Avec plaisir,
Et je te remercie à mon tour pour ce magnifique outil qu'est KNACSS.

Au passage, je pense être tombé sur un autre bug, j'ignore où le signalé ?
Sujet clos
Aller à