pulsanti non funzionanti

[merovese]

<header class="menu">		<div class="container">		<nav>                <ul class="navigation">					<li><a href="#slide1">#home</a></li>                    <li><a href="#slide2">#eventi</a></li>					<li><a href="#slide3">#storia</a></li>					<li><a href="#slide4">#lotteria</a></li>					<li><a href="#slide5">#social</a></li>					<li><a href="#slide6">#contatti</a></li>                    <a href="https://www.facebook.com/carnevalepenitro/?ref=hl"><img src="images/icons/Apps-Facebook-icon.png" width="18" height="18"></a>                  <a href="https://twitter.com/PenitroCarnival"><img src="images/icons/Apps-Twitter-icon.png" width="18" height="18"></a>                  <a href="https://www.instagram.com/carnevaledipenitro/"><img src="images/icons/Apps-Instagram-icon.png" width="18" height="18"></a>                  <a href="https://www.youtube.com/channel/UCBkp2NdPlXQ9-HgJTKvSskg"><img src="images/icons/Apps-Youtube-icon.png" width="18" height="18"></a>                  <img src="images/icons/Apps-Tripadvisor-icon.png" width="18" height="18">                    </ul>                    			</nav>		</div> 	</header>

Ciao a tutti, ho un piccolo problema con dei semplicissimi social button, allora se inserisco i pulsanti nella posizione che vedete nel codice, il pulsanti non funzionano, altrimenti le li tolgo dalla class navigation, e li inserisco nel tab nav, funzionano ma non riesco a spostarli nella posizione che desidero, potreste darmi una mano? dove sbaglio?

[merovese]

<header class="menu">        <div class="container">        <nav>                <ul class="navigation">                    <li><a href="#slide1">#home</a></li>                    <li><a href="#slide2">#eventi</a></li>                    <li><a href="#slide3">#storia</a></li>                    <li><a href="#slide4">#lotteria</a></li>                    <li><a href="#slide5">#social</a></li>                    <li><a href="#slide6">#contatti</a></li>                    <a href="https://www.facebook.com/carnevalepenitro/?ref=hl"><img src="images/icons/Apps-Facebook-icon.png" width="18" height="18"></a>                  <a href="https://twitter.com/PenitroCarnival"><img src="images/icons/Apps-Twitter-icon.png" width="18" height="18"></a>                  <a href="https://www.instagram.com/carnevaledipenitro/"><img src="images/icons/Apps-Instagram-icon.png" width="18" height="18"></a>                  <a href="https://www.youtube.com/channel/UCBkp2NdPlXQ9-HgJTKvSskg"><img src="images/icons/Apps-Youtube-icon.png" width="18" height="18"></a>                  <img src="images/icons/Apps-Tripadvisor-icon.png" width="18" height="18">                    </ul>                                </nav>        </div>     </header>

il codice lo inserisco bene ma si visualizza in questo modo....

[merovese]

[ C O D E ]
<header class="menu">
<div class="container">
<nav>
<ul class="navigation">
<li><a href="#slide1">#home</a></li>
<li><a href="#slide2">#eventi</a></li>
<li><a href="#slide3">#storia</a></li>
<li><a href="#slide4">#lotteria</a></li>
<li><a href="#slide5">#social</a></li>
<li><a href="#slide6">#contatti</a></li>
<a href="https://www.facebook.com/carnevalepenitro/?ref=hl"><img src="images/icons/Apps-Facebook-icon.png" width="18" height="18"></a>
<a href="https://twitter.com/PenitroCarnival"><img src="images/icons/Apps-Twitter-icon.png" width="18" height="18"></a>
<a href="https://www.instagram.com/carnevaledipenitro/"><img src="images/icons/Apps-Instagram-icon.png" width="18" height="18"></a>
<a href="https://www.youtube.com/channel/UCBkp2NdPlXQ9-HgJTKvSskg"><img src="images/icons/Apps-Youtube-icon.png" width="18" height="18"></a>
<img src="images/icons/Apps-Tripadvisor-icon.png" width="18" height="18">
</ul>

</nav>
</div>
</header>
[ / C O D E ]

forse così