Centrar verticalmente

[borjagat]

Como puedo centrar verticalemente en los circulos naranajas el texto?

<style>
ul.menu-botones-naranja {
text-align: center;
margin: 10px;
padding: 0px;
list-style-type: none;
display: table;
width: 100%;
}
.nav {
margin-left: 0px;
margin-bottom: 18px;
list-style: outside none none;
}
ul.menu-botones-naranja li {
display: table-cell;
padding: 0px 2%;
width: 175px;
}
li {
line-height: 18px;
}
a.boton-naranja, a.boton-naranja:link {
color: #FFF;
text-transform: uppercase;
background-color: #FF5131;
font-weight: bold;
text-align: center;
padding: 10px;
margin: 10px 0px;
text-decoration: none;
display: block;
height: 100px;
border-radius: 10%;

</style>
<ul class="nav menu-botones-naranja">
<li class="item-481"><a class="boton-naranja" href="/sss">ss</a></li><li class="item-482"><a class="boton-naranja" href="/w/os">Os</a></li><li class="item-483"><a class="boton-naranja" href="/15">sss</a></li><li class="item-484"><a class="boton-naranja" href="/s6">Cracovia </a></li></ul>

[xfxstudios]

mira los cambios que hice y me avisas si es lo que necesitas:

Código PHP:

<style>
ul.menu-botones-naranja {
text-align: center;
margin: 10px;
padding: 0px;
list-style-type: none;
display: table;
width: 100%;
}
.nav {
margin-left: 0px;
margin-bottom: 18px;
list-style: outside none none;
}
ul.menu-botones-naranja li {
display: table-cell;
padding: 0px 2%;
width: 175px;
}
li {
line-height: 18px;
}
a.boton-naranja, a.boton-naranja:link {
color: #FFF;
text-transform: uppercase;
background-color: #FF5131;
font-weight: bold;
text-align: center;
margin: 10px 0px;
text-decoration: none;
display: block;
height: 100px;
width:100px;
border-radius: 70px;
}
.item-480 a::before {
  content: '';
  display: inline-block;
  height: 100%;
  vertical-align: middle;
  margin-right: -0.25em;
}
 
</style> 
<ul class="nav menu-botones-naranja">
<li class="item-480"><a class="boton-naranja" href="/sss">ss</a></li>
<li class="item-480"><a class="boton-naranja" href="/w/os">Os</a></li>
<li class="item-480"><a class="boton-naranja" href="/15">sss</a></li>
<li class="item-480"><a class="boton-naranja" href="/s6">Cracovia </a></li>
</ul>
 

[borjagat]

no me funciona. Graicas por la ayuda pero no funciona. uso firefoz pero puede ser cualquier navegador.

[xfxstudios]

Iniciado por borjagat

no me funciona. Graicas por la ayuda pero no funciona. uso firefoz pero puede ser cualquier navegador.

estas 100% seguro que no te funciono o no miraste el codigo, en la imagen se ve que me funciono perfecto en chrome y mozilla

[borjagat]

He probado y si funciona pero si tengo dos lineas no funciona. es decir si en vez de cracovia pone hola mundo q. solo muestra bien el "hola"

así mimso, una duda co responsive design, como lo hago para que se pongan si no entran los 4 en horizontal, entren 2 y 2 centrados. a veces hace 3 y 1 no va centrado.


Gracias!!!!