Bonjour et bonne année à tous.
Décidément, je n'arrive pas à me faire au "responsive design". Il me semble pourtant que mon besoin est simple et légitime : je veux partager mon écran en cinq zones immuables. J'espérais y arriver à l'aide du concept de "grid" : dans mon CSS, j'ai cod" :Dans les deux colonnes de gauche, pas de problème : les contenus sont (pour le moment...?) bien maîtrisés. Mais les deux zones de droite sont destinées à visualiser (sous forme de tables) les contenus de deux tables SQLite : elles peuvent être grandes. Cela pourrait se résoudre très simplement avec des ascenseurs dans les tables. Mais non ! Sans doute au nom du sacro-saint concept de "responsive design" messire Firefox passe un temps considérable à faire des calculs (enfin, c'est comme ça que j’interprète le temps de réponse) aboutissant à un résultat absurde : j'ai un ascenseur à droite, pour toute la "page" qu'il faut faire descendre DIX FOIS pour la parcourir en entier. Au cours de ces dix étapes, on voit apparaitre ici ou là des bouts des contenu des colonnes de gauche, et l'une des tables (dans l'état actuel de la base de données) a encore un ascenseur !
Code CSS : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8 body {margin: 0; display: grid; grid-template-columns : 3fr 2fr 3fr; grid-template-rows : 1fr 1fr;} .colonne11 { grid-column: 1; grid-row: 1; overflow: auto; border: 1px solid black;} .colonne12 { grid-column: 1; grid-row: 2; overflow: auto; border: 1px solid black;} .colonne2 { grid-column: 2; grid-row: 1 / 2; max-height : 652px; border: 1px solid black;} .colonne31 { grid-column: 3; grid-row: 1; overflow: auto; border: 1px solid black;} .colonne32 { grid-column: 3; grid-row: 2; overflow: auto; border: 1px solid black;}
J'ai été long et verbeux, mais j'espère assez clair. Savez-vous si je dois renoncer à mon projet, ou s'il y a une solution "ergonomique" ?
Merci d'avance.
Partager