Discussion :

[Bayard]

Bonjour

Je ne parviens pas à faire une table dont la première colonne a une largeur fixe (50% de la table).
Il faut donc que la chaîne de caractère "texte tres loooooooooooong qsmdlkqdsdqslklklkpppdmqsdqdqmdqsdsdqmlqskdmqslkdqsmdlkqsmdlksqdmqsldk" soit coupée mise dans à la ligne:
par exemple
"texte tres loooooooooooong qsmdl
kqdsdqslklklkpppdmqsdqdqmdqsds
dqmlqskdmqslkdqsmdlkqsmdlksqd
mqsldk"

Le code

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<table width="400px" table-layout ="fixed" class="class_border">
			<thead>
			<tr>
				<td width="50%" class="class_border">colonne 1</td>
				<td width="25%" class="class_border">colonne 2</td>
				<td width="25%" class="class_border">colonne 3</td>
			</tr>
			</thead>
			<tr>
				<td width="50%"  word-break="anywhere"  >
					texte tres loooooooooooong qsmdlkqdsdqslklklkpppdmqsdqdqmdqsdsdqmlqskdmqslkdqsmdlkqsmdlksqdmqsldk<br/>
 
				</td>
				<td width="25%" class="class_border">
					données 2
			</td>
				<td width="25%" class="class_border" >
					données 3
				</td>
			</tr>
			</table>

ne fonctionne pas.

Internet m'a indiqué que les table-layout ="fixed" word-break="break-all" devaient suffire.
https://www.w3schools.com/cssref/pla...val=break-word
En ajoutant overflow-wrap="break-word" cela ne fonctionne pas mieux.
De même word-break="anywhere" ne fonctionne pas non plus.

Les deux fichiers html et css sont attachés

anomaly.html anomaly.css

Bonne journée

[Pytet]

Bonjour,

word-break est une propriété css, pas un attribut html.

Clique sur le bouton "Try it yourself" sur ta page du W3C pour voir comment utiliser cette propriété avec une classe css : https://www.w3schools.com/cssref/try...lay_word-break

[Bayard]

Un grand merci.
Je ne savais pas qu'une propriété css ne pouvait pas toujours devenir un attribut HTML.