hyphenate, word-break en css

**djun1** · 16/10/2012, 23h57

Bonjour,

Je ne sais pas pourquoi ça ne fonctionne pas. J'ai mit le <!doctype html> et <meta http-equiv="X-UA-Compatible" content="IE=9" />. Quel est mon erreur?

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
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
<!doctype html>
<html>
<head>
<meta http-equiv="X-UA-Compatible" content="IE=9" />
<link rel="stylesheet" type="text/css" href="word-break.css">
<title>Les sauts de ligne</title>
<style type="text/css">
.normal
{
 word-break:normal;
}
 
.break-all
{
 word-break:break-all;
}
 
.hyphenate
{
 word-break:hyphenate;
}
</style>
</head>
<body>
<table border="1" width="594">
<tr>
<td>
<span class="normal">Un atome 1 est la plus petite partie d'un corps simple pouvant se combiner transfo-chimique avec une autre.</span>
</td>
</tr><tr>
<td>
<span class="break-all">Un atome 1 est la plus petite partie d'un corps simple pouvant se combiner transfo-chimique avec une autre.</span>
</td>
</tr><tr>
<td>
<span class="hyphenate">Un atome 1 est la plus petite partie d'un corps simple pouvant se combiner transfo-chimique avec une autre.</span>
</td>
</tr>
</body>
</html>

**thelvin** · 17/10/2012, 12h44

Apparemment word-break ne peut être utilisé que sur des boîtes de type block, pas inline. Donc sur les <td>, pas sur les <span>.
Personnellement ça me serait pas venu à l'idée de faire autrement, mais c'est vrai qu'au fond, on peut se demander pourquoi.

Quant à word-break: hyphenate, j'ai aucune idée d'où tu es allé chercher ça.
On trouve un peu partout comment activer les césures avec tirets, notamment sur le MDN. À noter qu'il faut indiquer que la page est en français, sinon le navigateur ne peut pas deviner les règles de césure.

**djun1** · 17/10/2012, 23h41

Source : http://www.w3schools.com/cssref/css3_pr_word-break.asp

Mais, le problème s'est que hyphenate fait le même effet que normal. Est-ce normal?

XD, Le jeux de mot

**thelvin** · 18/10/2012, 17h47

Envoyé par djun1

Source : [url vers w3schools]

Ah, oui, les bras cassés du net. Comme tu peux le constater, W3Schools raconte beaucoup de conneries. Tu y gagnerais beaucoup à ignorer toutes leurs pages.

Envoyé par djun1

Mais, le problème s'est que hyphenate fait le même effet que normal. Est-ce normal?

Oui. hyphenate n'existe pas, donc le navigateur considère que la règle est invalide, et fait comme si elle n'était pas là. Si on ne change rien, word-break est initialement à normal, donc il y reste.

**djun1** · 18/10/2012, 23h34

merci

hyphenate, word-break en css

CSS

Vue hybride

Discussions similaires

Partager

Partager