CSS pour éviter de couper les lignes de texte ?

[Yoric]

J'ai un problème avec Gecko. Pas qu'avec Gecko, en fait, mais les autres navigateurs m'importent beaucoup moins. Mon problème est le suivant : quand une page s'affiche, presque systématiquement, pour des raisons de hauteur de mon écran, en haut et en bas du navigateur, je vois des demi-lignes de texte ou des images coupées en hauteur.





On est tous habitués mais c'est pas beau. Surtout quand j'essaye de faire des pages qui ressemblent à des livres.

Du coup, j'aimerais trouver une manière d'interdire à Gecko de couper ces lignes de texte et de ne les afficher que quand il y a moyen de les faire entrer en entier dans l'écran ou, à la rigueur, si elles font plus d'un écran de haut. Histoire d'avoir quelque chose qui ressemble à



Je suis prêt à y aller à coups de CSS, de JavaScript et même de XPCom, si quelqu'un me trouve une bonne idée.

Des suggestions ?

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.1.4) Gecko/20070602 Firefox/2.0.0.4 (Swiftfox) XPCOMViewer/0.9.5

[calimo]

CSS

Pas possible à mon avis.

XPCom

Pas utilisable pour le web. C'est pour faire des applications qui tourneront localement, donc l'utilisateur devrait l'installer...

JavaScript

Là ça doit probablement être possible, mais je n'ai aucune idée comment

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.6) Gecko/20070725 Firefox/2.0.0.6

[Yoric]

Quand j'écris XPCom, je veux dire que je suis tout à fait disposé à écrire une extension juste pour ça...

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.1.4) Gecko/20070602 Firefox/2.0.0.4 (Swiftfox) XPCOMViewer/0.9.5

[calimo]

Le problème c'est que l'extension doit être (activement) installée par le client, donc ça ne résoudra pas le problème pour tes visiteurs (qui ne vont pas tous installer l'extension)

(NB : il n'y a habituellement pas besoin de développer du XPCom pour faire une extension : elles sont en XUL et en Javascript).

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.8.1.6) Gecko/20070725 Firefox/2.0.0.6

[Yoric]

T'inquiète pas pour l'extension, je sais faire. Il me faut juste une piste pour la mise en page...

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.1.4) Gecko/20070602 Firefox/2.0.0.4 (Swiftfox) XPCOMViewer/0.9.5

[Benoit]

Je pense que tu peux t'aider des méthodes DOM offset* et scroll* et faire des calculs là-dessus.

On a terminé de les traduire la semaine dernière
http://developer.mozilla.org/fr/docs/DOM:element

Message envoyé avec : Mozilla/5.0 (Windows; U; Windows NT 5.1; fr; rv:1.9a8pre) Gecko/2007080309 Minefield/3.0a8pre

[Yoric]

Je pense que tu peux t'aider des méthodes DOM offset* et scroll* et faire des calculs là-dessus.

Moi, je veux bien, hein. Mais comment ?

Je veux dire, j'imagine que offset* peut m'aider à déterminer si un élément entre en entier dans la page. À coups de visibility:collapse, je dois pouvoir cacher les éléments qui dépassent. Ça, c'est la partie relativement simple.

Maintenant, je vais tomber régulièrement sur des éléments qui vont être plus grands que l'écran. Si c'est une image, pas de chance, c'est de ma faute. Mais si c'est un gros #text, voire un tableau, il faudrait que j'arrive à le découper. Et pour ce faire, il faut que je commence par arriver à déterminer où couper. Ce qui commence à faire beaucoup de boulot...

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.1.4) Gecko/20070602 Firefox/2.0.0.4 (Swiftfox) XPCOMViewer/0.9.5

[Benoit]

Pour les calculs en pixels il y a pas mal de détails ici :
http://www.quirksmode.org/dom/getstyles.html

La propriété CSS qui t'intéresse sans doute le plus est "line-height".

Sinon, c'est normal que ça te demande beaucoup de boulot, tu n'es ni en mode texte (un nombre entier de lignes) ni sur un média paginé.

Remarque : si tu es prêt à faire une extension tu peux peut-être essayer de hacker le mode aperçu avant impression qui est prévu pour ça

[Yoric]

Remarque : si tu es prêt à faire une extension tu peux peut-être essayer de hacker le mode aperçu avant impression qui est prévu pour ça

En fait, déjà fait Pas encore trouvé comment fixer la taille de la fenêtre mais déjà fait. Le problème est que dès que du code JS cause une modification du DOM, une boîte de dialogue s'affiche pour m'insulter.

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.1.6) Gecko/20070803 Firefox/2.0.0.6 (Swiftfox) XPCOMViewer/0.9.5

[Yoric]

Bon, ben j'ai ma réponse (merci eliaf) : c'est prévu... mais ça ne sera pas fini à temps pour Firefox 3.

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.1.6) Gecko/20070803 Firefox/2.0.0.6 (Swiftfox) XPCOMViewer/0.9.5

[Yoric]

Ah, deuxième réponse de elif: utiliser les colonnes de CSS 3.

Et ça marche

Message envoyé avec : Mozilla/5.0 (X11; U; Linux i686; en-US; rv:1.8.1.6) Gecko/20070803 Firefox/2.0.0.6 (Swiftfox) XPCOMViewer/0.9.5