How do I neatly word wrap an Email address in HTML

Viewed 175

I am displaying Email addresses on an HTML page (It is internal so no need to obfuscate)

Long Email addresses are wrapping but they do not look nice

donaldduck@exampl
e.com

It would be much neater if the line break was at the "@" character

donaldduck
@example.com

The best I have achieved is by adding a space before the @, but this is not perfect on the emails that do not wrap

donaldduck @example.com

Is there a way to say "break at the @ character if necessary"?

1 Answers

Do like this:

<p>donaldduck<wbr>@example.com</p>

see this:

<!DOCTYPE html>
<html>
<body>

<p>donaldduck<wbr>@example.com</p>

</body>
</html>

Related