Zatrzymaj dzielenie wyrazów na słowa - css, uiwebview, word-wrap

body { word-wrap: break-word;}

Używam tego kodu (powyżej), aby dopasować tekst w body do tego pojemnika. Jednak nie podoba mi się to, że łamie słowa.

Czy jest inny sposób, w jaki nie rozdzieli słów i tylko łamie wiersz po słowie?

EDYCJA: To jest do użytku wewnątrz UIWebView.

Odpowiedzi:

6 dla odpowiedzi № 1

posługiwać się white-space: wrap;. Jeśli ustawiłeś szerokość elementu, na którym to ustawiasz, powinien działać.

aktualizacja - renderowane dane w Firefoksie

---

11 dla odpowiedzi nr 2

Może być trochę za późno, ale możesz dodać ten css, aby zatrzymać dzielenie wyrazów:

.element {
-webkit-hyphens: none;
-moz-hyphens:    none;
-ms-hyphens:     none;
hyphens:         none;
}

---

5 dla odpowiedzi nr 3

Możesz spróbować tego ...

body{
white-space: pre; /* CSS2 */
white-space: -moz-pre-wrap; /* Mozilla */
white-space: -hp-pre-wrap; /* HP printers */
white-space: -o-pre-wrap; /* Opera 7 */
white-space: -pre-wrap; /* Opera 4-6 */
white-space: pre-wrap; /* CSS 2.1 */
white-space: pre-line; /* CSS 3 (and 2.1 as well, actually) */
word-wrap: break-word; /* IE */
}

{zawijanie tekstu:;} jest własnością własnościową IE, a nie częścią css. Obsługa firefoxa jest poprawna. Niestety, FF nie obsługuje miękkiego łącznika /., więc nie jest to opcja. Możesz ewentualnie włożyć włosy lub cienką przestrzeń, / (sprawdź mnie na encji numerycznej) i /, odpowiednio.

Zrobienie {overflow: hidden;} odciąłoby przepełnienie i {przepełnienie: auto;} spowodowałoby przepełnienie umożliwiające przewijanie.

---

3 dla odpowiedzi № 4

Proszę użyć wartości nowrap i wrap, czy nie przyszedł po mnie, nowrap rozwiązał problem.

Use white-space: nowrap;

---

2 dla odpowiedzi № 5

W mojej sytuacji staram się zapewnić zawijanie słów przy prawidłowym łamaniu słów w komórkach tabeli.

Aby to osiągnąć, potrzebuję następującego CSS.

table {
table-layout:fixed;
}
td {
white-space: wrap;
}

sprawdź również, czy nic się nie zmienia word-break do break-word zamiast normal.

---

0 dla odpowiedzi № 6

Miałem podobny problem w mojej strukturze siatki i użyłem łamania słów: break-word; w mojej siatce, a mój problem został rozwiązany.

---

0 dla odpowiedzi № 7

Miałem ten sam problem, rozwiązałem go za pomocą następującego css:

.className {
white-space:pre-wrap;
word-break:break-word;
}

---