Break lengthy words HTML CSS. Get through Chrome word-wrap problem in tables.

Break lengthy words HTML CSS.

Get through Chrome word-wrap problem in tables.


Force lengthy words to break and fit in to <div>, Use CSS property.
This avoids lengthy words in table cell to push other cells and scramble whole table.

.break-word { word-wrap: break-word; }

Note:

In chrome break-word inside trable wont work untill you set table-layout: fixed.
so use

word-wrap: break-word;
table-layout: fixed;


Or If you are using Djanog use truncate words or truncate chars.

{{ value|truncatechars:9 }} Django 1.4

trucatechars included in Django 1.4 so

{{ value|slice:"5" }}{% if value|length > 5 %}...{% endif %} in former django (djanog 1.2 or 1.3)

https://docs.djangoproject.com/en/dev/ref/templates/builtins/#truncatechars