Well, text-overflow: ellipsis;
could work, but then you truncate your headings and can’t really predict what they will look like. Michael Scharnagl has been doing research and he found a quite bulletproof solution. As it turns out, the best option is to combine overflow-wrap
with word-wrap
and hyphens
that will show hyphens for every browser supporting it and will break lines in every other browser. Solved! (vf)