Hmmm, okay.
I know I tried using differing widths on the staff-info class, but I didn’t notice any kind of difference if I had it reduced. I tried 60%, 70%, 80% and 90%. 70% seemed to wrap text just right that had spaces breaking up the text, but had zero effect on text without a space break.
However, I did not try max-width, so maybe that’s where my issue with word-wrap: break-word came from. I’ll try it out on the test page and see if it makes a difference.
EDIT:
I changed the CSS for staff-info:
.main-content .staff-image .staff-info { width: 70%; max-width: 70%; word-wrap: break-word; }
And it broke up the giant email link, but still some discrepancy with the lengths, I guess I just need to tweak the max-width some more?