blattertech informatikLukas BlatterNiederlenzerstrasse 21
5600 Lenzburg/AGSwitzerland

079 569 25 90
https://www.blattertech.ch

Adresse anzeigen

CSS3: Silbentrennung “hyphens”

7. Februar 2012 |  CSS |  WEBDESIGN1 Kommentare

Bis anhin war die Silbentrennung mit HTML nicht möglich oder nur durch den Umweg eines JavaScripts. Mit der CSS Eigenschaft "hyphens" kann die Silbentrennung nun aktiviert werden.

body {
 -webkit-hyphens: auto;
 -moz-hyphens: auto;
 -ms-hyphens: auto;
 hyphens: auto;
}

Im Moment unterstützt noch kein Browser die Eigenschaft korrekt. Deshalb gibt es Vendor-Prefixes für Webkit, Microsoft und Mozilla.

Es spricht jedoch aus meiner Sicht nichts dagegen diese Eigenschaft bereits in allen Projekten einzusetzen. Derzeit unterstützt als einziger Opera diese Eigenschaft noch nicht. In Anbetracht seiner Marktverbreitung kann dies aus meiner Sicht vernachlässigt werden. Es ist zudem anzunehmen, dass auch Opera diese Eigenschaft über kurz oder lang unterstützen wird

Über den Autor:

Lukas Blatter

bloggt und twittert seit 2009 aus Leidenschaft diverse Themen rund um Webdesign, PHP, TYPO3, CMS Made Simple, Computer und weiteres.

Er ist Gründer und Inhaber von blattertech informatik, Ehemann und Vater einer Kinderschar.

Kommentare

Opera unterstützt es
21. April 2012 von sebix
Mein aktueller Opera 11.62 (stable) unterstütz die Eigenschaft -o-hyphens problemlos (und nach kurzem Test würde ich die Trennung als gelungen bezeichnen). Auch im stabilen FF (11) gehts, aber im stabilen Chromium 18 bei mir nicht.
Testen lässt sich das zB hier: http://meyerweb.com/eric/css/tests/css3/show.php?p=hyphens
Opera 12.02 auf Windows
17. Oktober 2012 von Torsten
Bei mir klappt es nicht (Opera 12.02 auf Windows XP). Und wenn man in HTML in den langen Wörtern soft hyphens setzt (& shy ;), werden die Wörter zwar am Ende der Zeile an der entsprechenden Stelle getrennt – aber ohne den Bindestrich! Sehr seltsam.

Auf Grund des hohen Spamaufkommens können zu diesem Beitrag keine Kommentare mehr abgegeben werden