I have a long email address that breaks out of the column. I want to make it wrap so it’s responsive.
I can do word-break: break-all; but that looks like a bit of a mess. I would like it to break/wrap just before the @symbol.
This article talks about adding < wbr > or ‘’ how can I add that in to a link in Bootstrap studio?
https://stackoverflow.com/questions/23776767/wrapping-long-email-addresses-in-small-boxes
Assuming you’re putting the email address inside a link, you would add your link component, then add two span components inside the link. Make the first span the email address name, and the second span the @domainname.com.
Then select the first span, go to the Options panel, and turn Text Break on.
The email address will break just before the @ symbol, as shown in the image below.
(NOTE: it’s not good practice to have visible, plain text email addresses on your website, as it will encourage spam.)
