Spacing issues between Chrome and Firefox/IE

Question

I'm getting weird spacing issues between Chrome and FF. Chrome (pic 2) looks fine but in FF (pic 1) there's larger spacing. I'm quite sure it's tied to text-align:justify; .

EDIT On closer inspection it looks like word-break:break-all; is not being rendered in FF and IE!

.project_miniwrap { position:absolute;   
width:59%;
margin: auto;
top: 23%; left: 0; right: 0; text-align:justify; } 

.project-link {
font-family: 'Arial-BoldMT';
color:#262626;
font-size:50px;
word-break:break-all;
line-height:63px;
text-decoration:none;       
border-bottom: solid transparent 2px;
letter-spacing: -2px; }

Answer 1

Different browsers render text spacing differently even if you have the letter-spacing property.

Best bet is to try to use browser specific CSS and adjust each one accordingly until you get the spacing you need.

Answer 2

I simply had to add word-break:break-all; to the wrapping container for it to work in FF and IE. Dunno why.