[Résolu] Tableau Html dans Css gérée par Knacss

bonjour,
j'essaye de comprendre la mise en page avec le modèle proposé par Knacss

Tout ce passe parfaitement et se positionne comme je l'espère sauf quand je désire mettre un tableau html. ( oups... pas sur la tête svp, je suis un parfait débutant amateur )

Sur ce tableau le contenu de ma cellule se met à déborder quand je redimensionne ma fenêtre en 1024x768.

Si je réduit encore plus, là tout rentre dans l'ordre, que dois je faire pour que le contenu de ma cellule s'adapte automatiquement ?

le lien pour voir, car mon explication est peut être pas trés claire

http://bmag.cwebh.org:9000/01test_knacss/page2.html

Cdt

Bonjour,

ah une question avec un lien permettant de constater le problème en 20 secondes, si seulement tout le monde faisait pareil

- un tel contenu n'est pas réaliste : aucun mot ne fait 70 caractères de long, sauf les URLs. Par défaut, les navigateurs ne se soucient donc pas d'afficher correctement ce contenu et on utilise en général du "lorem ipsum" (ou du schnapsum ).
- il y a bien une solution CSS qui était dans KNACSS et y est toujours en dessous de ~752 ou 768px de large (j'utilise Firefox avec le mode responsive "Shift-Ctrl-M"), à savoir word-wrap: break-word; Perso j'en suis très fan pour des raisons d'accessibilité mais je ne me rappelle plus pourquoi Raphaël l'avait enlevé

body {
  word-wrap: break-word;
}

Bonjour,
un grand merci pour la réponse, j'y découvre une commande clavier que je connaissez pas et la solution
Genial

pour le lien.. , n'étant pas du tout de la partie, je n'étais pas sur du tout que mon explication soit claire, donc une image étant plus parlante.

Je vais utiliser le schapsum.... ca va être dur pour un vieux "sudiste" de copier des mots qui viennent d'au delà de la Garonne, noun des dious

en tout cas MERCI

SchNapsum macarel!

Felipe a écrit :
- il y a bien une solution CSS qui était dans KNACSS et y est toujours en dessous de ~752 ou 768px de large (j'utilise Firefox avec le mode responsive "Shift-Ctrl-M"), à savoir word-wrap: break-word; Perso j'en suis très fan pour des raisons d'accessibilité mais je ne me rappelle plus pourquoi Raphaël l'avait enlevé

body {
  word-wrap: break-word;
}

Hello,

Il y a plusieurs explications à ce que cette règle soit passée des styles généraux aux styles "petits écrans" uniquement.

1- Elle était combinée à hyphens. Or hyphens créait des traits d'union un peu trop souvent non sollicités sur écrans classiques. Du coup, j'ai réservé hyphens (et word-wrap) aux petits écrans. Pour word-wrap, j'aurais effectivement pu le laisser sur écrans classiques mais je reste mitigé.

2- Attention, word-wrap n'est pas une propriété qui s'hérite en cascade : si je l'applique à body, rien ne débordera de body mais ça n'empêchera pas les débordements sur div, table, td, p, etc. En pratique, il est nécessaire de l'appliquer au cas par cas sur les éléments concernés.

Philippe : l'appliquer word-wrap sur body pour des raisons d'accessibilité semble être une bonne idée, surtout quand on zoom sur les textes, mais pour être complètement efficace, il faudra quand-même l'appliquer aux blocs de contenus (aussi, voire plutôt qu'à body).

Bonne journée