Ciao a tutti! mi potreste aiutare? vorrei solo allineare orizzontalmente queste icone con un margine di 5px l'una dall'altra. Le ho inserite dentro un div ma me le mette troppo lontane se gli do il comando float. vi posto il codice grazie in anticipo!!!

HTML

<div class="s.n">





</div>

CSS

.s.n{height: 64px; width: 120px;}
.social-url{margin-right:2px;border:none;}
a.social{background-image: url(../images/icons/facebook_dark.png); display: block; background-repeat: no-repeat; width: 120px;height: 64px;}
a.social:hover{background-image: url(../images/icons/facebook_active.png); display: block; background-repeat: no-repeat; }
a.social-1{background-image: url(../images/icons/twitter_dark.png); display: block; background-repeat: no-repeat; width: 120px;height: 64px; float:}
a.social-1:hover{background-image: url(../images/icons/twitter_active.png); display: block; background-repeat: no-repeat;}
a.social-2{background-image: url(../images/icons/in_dark.png); display: block; background-repeat: no-repeat; width: 120px; height: 64px;}
a.social-2:hover{background-image: url(../images/icons/in_active.png); display: block; background-repeat: no-repeat; width: 120px; height: 64px; }
a.social-3{background-image: url(../images/icons/rss_dark.png); display: block; background-repeat: no-repeat; width: 120px; height: 64px;}
a.social-3:hover{background-image: url(../images/icons/rss_active.png); display: block; background-repeat: no-repeat; width: 120px; height: 64px;}
a.social-4{background-image: url(../images/icons/yahoo_dark.png); display: block; background-repeat: no-repeat; width: 120px; height: 64px;}
a.social-4:hover{background-image: url(../images/icons/yahoo_active.png); display: block; background-repeat: no-repeat; width: 120px; height: 64px;}