Word-break:break-word not working in Firefox 21

css firefox word-break
David picture David · Jun 17, 2013 · Viewed 11.1k times · Source

I've added word-break:break-word to the comments on my site to start breaking up the words when they overflow the comment box, but it doesn't appear to be working in Firefox. I've done a JS fiddle of the setup and it does work. So something must be conflicting but I can't find it for the life of me.

JS Fiddle (working): http://jsfiddle.net/F6K99/6/

Live problem: http://bit.ly/13NcY5F

Answer

Nitesh picture Nitesh · Jun 17, 2013

You can achieve this by the following:

A. Use word-break:break-all; instead of word-break:break-word;

WORKING SOLUTION

B. Or, Use word-wrap: break-word; instead of word-break:break-word;

WORKING SOLUTION

As far as I know, word-break does not have break-word attribute.

Hope this Helps.

Related questions

Hide scroll bar, but while still being able to scroll

I want to be able to scroll through the whole page, but without the scrollbar being shown. In Google Chrome it's: ::-webkit-scrollbar { display: none; } But Mozilla Firefox and Internet Explorer don't seem to work like that. I also tried this …

Read More
Targeting only Firefox with CSS

Using conditional comments it is easy to target Internet Explorer with browser-specific CSS rules: <!--[if IE 6]> ...include IE6-specific stylesheet here... <![endif]--> Sometimes it is the Gecko engine (Firefox) that misbehaves. What would be …

Read More
Custom CSS Scrollbar for Firefox

I want to customize a scrollbar with CSS. I use this WebKit CSS code, which works well for Safari and Chrome: ::-webkit-scrollbar { width: 15px; height: 15px; } ::-webkit-scrollbar-track-piece { background-color: #C2D2E4; } ::-webkit-scrollbar-thumb:vertical { height: 30px; background-color: #0A4C95; } How can …

Read More