Je pense être arrivé à une maquette acceptable modulo un point qui me
chiffonne :
Mon tableau est constitué d'un nombre potentiellement important de lignes
chacune composé de deux cellules principales (recto et verso).
- Au recto on trouve en fait 2 cellules (séparation horizontale);
- Au verso on trouve en fait 3 cellules (séparation verticale).
Le problème est qu'une interruption dans les bordures (horizontalement à
gauche et verticalement à droite) est visible et fait tache.
La solution la plus simple me semble de définir un tableau d'une ligne et
deux cellules avec les bordures qui vont bien, un incluant un tableau sans
bordure dans chacune de ces cellules (1 ligne de 2 cellules à gauches, 3
lignes d'1 cellule à droite).
Existe-t-il une solution plus élégante en utilisant les CSS ?
Je commence (avec du retard) à tester les suggestions proposées. Merci à tous.
(...)
J'ai pris le temps de commencer à lire, comprendre et appliquer. Cela donne <http://raverdy.christophe.free.fr/coreen/flashcard/v_02/flashcard.html> un résultat identique en apparence.
En fait la feuille de style principale est plus légère (de 1299 à 681 octets), le code html y gagne pareillement (de 12040 à 6737 octets) mais surtout la lisibilité d'une ligne de tableau s'est très largement améliorée :
On peut certainement gagner en : - employant des noms de class plus courts - supprimant des class (en td on emploie la même)
Je voulais juste suggérer le gain obtenu en passant d'une logique de tableaux imbriqués à l'utilisation des <div>
les class me semblent quand même préférables pour la lisibilité (ultérieure et par des tiers) du document. D'autre part j'appréhende certaines joyeusetés comme l'impression au format A4 avec une classe "saut de page" à intégrer toutes les x lignes.
Je ne nie pas la performance qui peut avoir son utilité (mauvaise connectivité, mémoire limitée), mais je suis davantage intéressé par la lisibilité de mon code.
SAM wrote:
Christophe Raverdy a écrit :
Je commence (avec du retard) à tester les suggestions proposées. Merci à
tous.
(...)
J'ai pris le temps de commencer à lire, comprendre et appliquer. Cela
donne
<http://raverdy.christophe.free.fr/coreen/flashcard/v_02/flashcard.html>
un résultat identique en apparence.
En fait la feuille de style principale est plus légère (de 1299 à 681
octets), le code html y gagne pareillement (de 12040 à 6737 octets) mais
surtout la lisibilité d'une ligne de tableau s'est très largement
améliorée :
On peut certainement gagner en :
- employant des noms de class plus courts
- supprimant des class (en td on emploie la même)
Je voulais juste suggérer le gain obtenu en passant d'une logique de
tableaux imbriqués à l'utilisation des <div>
les class me semblent quand même préférables pour la lisibilité (ultérieure
et par des tiers) du document. D'autre part j'appréhende certaines
joyeusetés comme l'impression au format A4 avec une classe "saut de page" à
intégrer toutes les x lignes.
Je ne nie pas la performance qui peut avoir son utilité (mauvaise
connectivité, mémoire limitée), mais je suis davantage intéressé par la
lisibilité de mon code.
Je commence (avec du retard) à tester les suggestions proposées. Merci à tous.
(...)
J'ai pris le temps de commencer à lire, comprendre et appliquer. Cela donne <http://raverdy.christophe.free.fr/coreen/flashcard/v_02/flashcard.html> un résultat identique en apparence.
En fait la feuille de style principale est plus légère (de 1299 à 681 octets), le code html y gagne pareillement (de 12040 à 6737 octets) mais surtout la lisibilité d'une ligne de tableau s'est très largement améliorée :
On peut certainement gagner en : - employant des noms de class plus courts - supprimant des class (en td on emploie la même)
Je voulais juste suggérer le gain obtenu en passant d'une logique de tableaux imbriqués à l'utilisation des <div>
les class me semblent quand même préférables pour la lisibilité (ultérieure et par des tiers) du document. D'autre part j'appréhende certaines joyeusetés comme l'impression au format A4 avec une classe "saut de page" à intégrer toutes les x lignes.
Je ne nie pas la performance qui peut avoir son utilité (mauvaise connectivité, mémoire limitée), mais je suis davantage intéressé par la lisibilité de mon code.
Christophe Raverdy
SAM wrote:
On peut gagner encore plus (2432 octets + 630 octets de styles) en n'ayant aucune class :
à voir ici : <http://cjoint.com/data/fpmElFtv4w_flashcard_asm.htm> et version IE6 (plus lourde) <http://cjoint.com/data/fpnZUySge7_flashcard_asm_ie.htm>
En revenant sur la définition de dl, dt et dd (je ne me sers jamais des listes de définition) j'ai compris le procédé. J'ai également été aidé par http://www.pompage.net/pompe/listesdefinitions/ qui présente une utilisation intéressante.
C'est effectivement efficace et malin voire même peut-être trop malin : Ma définition tient essentiellement dans le "zigouuigoui kivabien" le reste étant du texte rattaché réparti sur la première et la seconde face (2 "clés" et 2 "textes" (lecture et exemple)). Par rapport à mon approche
Concernant la propriété "first-child" expliquée par exemple en http://fr.selfhtml.org/css/proprietes/pseudoformats.htm j'ai là encore des problèmes dans la mesure où j'ai tendance à raisonner en terme de recto-verso plus que de premier dt/dd vs dt/dd suivant(s).
SAM wrote:
On peut gagner encore plus (2432 octets + 630 octets de styles)
en n'ayant aucune class :
à voir ici :
<http://cjoint.com/data/fpmElFtv4w_flashcard_asm.htm>
et version IE6 (plus lourde)
<http://cjoint.com/data/fpnZUySge7_flashcard_asm_ie.htm>
En revenant sur la définition de dl, dt et dd (je ne me sers jamais des
listes de définition) j'ai compris le procédé. J'ai également été aidé par
http://www.pompage.net/pompe/listesdefinitions/ qui présente une utilisation
intéressante.
C'est effectivement efficace et malin voire même peut-être trop malin : Ma
définition tient essentiellement dans le "zigouuigoui kivabien" le reste
étant du texte rattaché réparti sur la première et la seconde face
(2 "clés" et 2 "textes" (lecture et exemple)). Par rapport à mon approche
Concernant la propriété "first-child" expliquée par exemple en
http://fr.selfhtml.org/css/proprietes/pseudoformats.htm j'ai là encore des
problèmes dans la mesure où j'ai tendance à raisonner en terme de
recto-verso plus que de premier dt/dd vs dt/dd suivant(s).
à voir ici : <http://cjoint.com/data/fpmElFtv4w_flashcard_asm.htm> et version IE6 (plus lourde) <http://cjoint.com/data/fpnZUySge7_flashcard_asm_ie.htm>
En revenant sur la définition de dl, dt et dd (je ne me sers jamais des listes de définition) j'ai compris le procédé. J'ai également été aidé par http://www.pompage.net/pompe/listesdefinitions/ qui présente une utilisation intéressante.
C'est effectivement efficace et malin voire même peut-être trop malin : Ma définition tient essentiellement dans le "zigouuigoui kivabien" le reste étant du texte rattaché réparti sur la première et la seconde face (2 "clés" et 2 "textes" (lecture et exemple)). Par rapport à mon approche
Concernant la propriété "first-child" expliquée par exemple en http://fr.selfhtml.org/css/proprietes/pseudoformats.htm j'ai là encore des problèmes dans la mesure où j'ai tendance à raisonner en terme de recto-verso plus que de premier dt/dd vs dt/dd suivant(s).
Pierre Goiffon
Christophe Raverdy wrote:
mon IE6 ne sait pas afficher les polices esstrangères :-(
Avec XP par contre, si l'on veut afficher les mêmes polices (il s'agit ici du coréen) il faut soit installer les méthodes de saisie exotiques soit récupérer des polices ttf (http://www.wazu.jp/index.html) et les installer à la convenance sous windows/fonts (ou windows/polices) voire /windows.
Rapide réponse sur ce point précis. Sur XP il faut ouvrir les options régionales et linguistiques, et cocher dans l'onglet langues les options désirées. De mémoire il existe l'équivalent sous 2000 ?
Christophe Raverdy wrote:
mon IE6 ne sait pas afficher les polices esstrangères :-(
Avec XP par contre, si l'on veut
afficher les mêmes polices (il s'agit ici du coréen) il faut soit installer
les méthodes de saisie exotiques soit récupérer des polices ttf
(http://www.wazu.jp/index.html) et les installer à la convenance sous
windows/fonts (ou windows/polices) voire /windows.
Rapide réponse sur ce point précis.
Sur XP il faut ouvrir les options régionales et linguistiques, et cocher
dans l'onglet langues les options désirées. De mémoire il existe
l'équivalent sous 2000 ?
mon IE6 ne sait pas afficher les polices esstrangères :-(
Avec XP par contre, si l'on veut afficher les mêmes polices (il s'agit ici du coréen) il faut soit installer les méthodes de saisie exotiques soit récupérer des polices ttf (http://www.wazu.jp/index.html) et les installer à la convenance sous windows/fonts (ou windows/polices) voire /windows.
Rapide réponse sur ce point précis. Sur XP il faut ouvrir les options régionales et linguistiques, et cocher dans l'onglet langues les options désirées. De mémoire il existe l'équivalent sous 2000 ?
