How can I stop each word appearing in a new line Options

[strawberry]

Hi, I'm very new to html so apologies for any obvious errors.

I have a couple of pages on a website I've recently taken over which are not displaying links after icons correctly. Each word is on a new line and I can't figure out how to fix it. From what I've read, this might have something to do with the div tags in my code, but I can't figure it out. The error is occurring in link text after icons.

Any help much appreciated!

URL: http://unloc.net/index.php/about-us/people

section of code:

<div class="uk-grid">
<div class="uk-width-1-4"><img src="images/photos/people/PIs/polinabayvel.jpg" alt="Polina Bayvel" id="" style="margin-top: 0px; margin-left: 20px; margin-right: 20px;" title="" /></div>
<div class="uk-width-3-4">
<h2>Polina Bayvel</h2>
<h3>Programme Director</h3>
<p>Polina Bayvel is a professor in optical communications and head of the <a href="http://www.ee.ucl.ac.uk/ong" target="_blank">Optical Networks Group</a> at the Electronic &amp; Electrical Engineering Department in UCL. In 2016, Prof. Bayvel was elected a fellow of the Royal Society. Prof. Bayvel's research focuses on theoretical and experimental investigation of high-speed (10-160 Gbit/s and beyond), multiwavelength, optically amplified telecommunications networks including: (i) optical network design, wavelength allocation and routing algorithms, (ii) study of high-speed transmission systems and impairments due to optical fibre nonlinearities and their mitigation, using a variety of techniques, including use of advanced modulation formats, electronic pre-distortion, coherent detection and digital signal processing, optical equalisation and regeneration, and new devices for optical network applications.</p>
<p><span class="icon-mail"></span>p.bayvel[at]ucl.ac.uk<br /><span class="icon-phone"></span>+44 (0)20 7679 7921<br /><span class="icon-home-2"><a href="https://www.ee.ucl.ac.uk/staff/academic/pbayvel" target="_blank">Homepage</a></span><br /><span class="icon-youtube"><a href="https://www.youtube.com/watch?v=qezHUwou9dY" target="_blank">Clifford Paterson Lecture at the Royal Society</a></span></p>
<hr /></div>
</div>

[pandy]

In your style sheet you've made .icon-youtube 14px wide. Remove the width altogether.

In fact, I don't see why you need a SPAN around each line at all. But that you do have that doesn't make anything display funny, just a comment from me.

[strawberry]

Thanks, pandy. I took out the last SPAN and that has fixed the text. That's good enough for now, but if anyone has further ideas let me know!