Make text and icon stick together on responsive design

Question

I'm using this for my top bar text

<i class="fa fa-envelope" style="margin: 0 4px"></i>[email protected]

but in responsive design the envelope icon gets split from the mail text. I am trying to stick them together with no luck.

I have tried this but nothing

S Overflow

Answer 1

you are looking for white-space: nowrap; try adding the parent container of the icon and text that CSS class.

W3S link for more information