Hola, lo primero os pongo el codigo:
Código HTML:
<div id="iconhoriz" align="center">
<ul class="icons">
<li>
<a href="http://www.vendermiweb.com">
<img src="img.png" title="Inicio" alt="Inicio" width="32" height="32"><br>
<span class="sispan">Inicio</span>
</a>
</li>
<li>
<a href="http://www.vendermiweb.com">
<img src="img.png" title="Foro" alt="Foro" width="32" height="32"><br>
<span class="sispan">Foro</span>
</a>
</li>
</ul>
</div>
Y el CSS:
Código HTML:
#iconvert,
#iconhoriz {
margin-top: 0px;
}
#iconvert .icons,
#iconhoriz .icons{
padding: 0;
}
#iconhoriz {
padding:0pt 15px 0pt 0pt;
background-position: 100% 100% !important;
}
#iconvert {
padding:15px 0pt 0pt 0pt;
background-position: 0% 0% !important;
}
/* link settings */
#iconvert li,
#iconhoriz li {
float: left;
text-align: center;
margin:0;
padding-right: 20px;
padding-top: 10px;
list-style: none;
background: none;
position: relative;
display : inline;
}
/*icon settings*/
#iconhoriz .icons {
cursor: pointer;
overflow: hidden;
padding: 0;
margin: 0px;
}
#iconvert .icons {
cursor: pointer;
overflow: hidden;
padding: 0;
margin: 0px;
}
/* And Now lets set up the caption box */
#iconhoriz .sispan,
#iconevert .sispan {
padding: 0px;
font-weight: bold;
text-decoration: none;
}
img{
border: none;
}
#iconhoriz a{
height: 100%;
text-decoration: none;
display : inline;
}
#iconvert a{
left:0;
bottom: 0;
width: 100%;
display: block;
background-position: 0 100%;
text-decoration: none;
}
El problema es que quiero que la lista me salga centrada dentro del contenedor iconhoriz y siempre me sale alineada a la izquierda, he probado a cambiar el float:left; por center pero entonces de descuadra y ya no sale una lista horizontal.
Un saludo y gracias!