HTML - Centrar texto en la caja de etiqueta <li>

 
Vista:
sin imagen de perfil
Val: 1
Ha aumentado su posición en 6 puestos en HTML (en relación al último mes)
Gráfica de HTML

Centrar texto en la caja de etiqueta <li>

Publicado por Laura (1 intervención) el 05/01/2019 02:42:45
error

Hola, estoy tratando de aprender html online y tengo dudas que espero me puedan ayudar, por ahora son muy basicas. Tengo estas cajas que son <li> puestas inline
¿Como hago para que los textos me queden centrados tanto de los costados como de arriba y abajo?

Gracias.
-------------codigo html-----------------------
1
2
3
4
5
6
7
8
<nav>
        <ul>
		<li id="configuracion">Configuracion</li>
		<li id="ventas">Ventas</li>
		<li id="compras">Compras</li>
		<li id="articulos">Articulos</li>
       </ul>
</nav>
-----------codigo CSS--------------------
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
#articulos {
	background-color: #66ffff;
	padding: 53px 53px 10px 10px;
	display: inline-block;
}
#compras{
	background-color: #66ffff;
	padding: 53px 53px 10px 10px;
	display: inline-block;
 
}
#ventas {
	background-color: #66ffff;
	padding: 53px 53px 10px 10px;
	display: inline-block;
}
 
#configuracion{
	background-color: #66ffff;
	padding: 53px 53px 10px 10px;
	display: inline-block;
}
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder
Imágen de perfil de Alejandro
Val: 265
Plata
Ha disminuido 1 puesto en HTML (en relación al último mes)
Gráfica de HTML

Centrar texto en la caja de etiqueta <li>

Publicado por Alejandro (72 intervenciones) el 05/01/2019 18:34:18
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<style>
	ul{
		padding:0px;
	}
	nav>ul>li{
		background-color:#66ffff;
		display:inline-block;
		width:120px;
		line-height:60px;
		text-align:center;
	}
</style>
 
<nav>
	<ul>
		<li id="configuracion">Configuracion</li>
		<li id="ventas">Ventas</li>
		<li id="compras">Compras</li>
		<li id="articulos">Articulos</li>
	</ul>
</nav>
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar