i'd like to keep some words together in a html email, so that there is no break between them (using different screen sizes), as long as possible, just before/after.
I've 2 options, both seem to work well:
<p>Lorem ipsum <span style="white-space:nowrap">words without a break</span> biberium.</p>
<p>Lorem ipsum <span style="display:inline-block">words without a break</span> biberium.</p>
Which is the better, which one should i use?
"Both seem to work well" -but only in the email client you tested.
The number one thing to note is that getting consistency across different email clients is tricky.
Having a <span> use display:inline-block will not work on Windows Outlook desktop. Inline-block doesn't even work at all on some email clients such as Telstra webmail. White-space:nowrap works okay, but again not on Outlooks.
The main way forward is to use a non-breaking space, i.e.
Even then, some clients, notable Apple, will break it if there's not enough space. In that case, in combination with nowrap may work. But, if there truly is not enough space, mobiles will tend to shrink the text so it fits but is unreadable. Therefore, it's best not to force the issue, and to just use alone. Even so, if the line becomes too long, some clients will become unreadable if they can't break it (especially Gmail apps).