HTML - Problema con estilos en DIV

   
Vista:

Problema con estilos en DIV

Publicado por Jose (1 intervención) el 19/08/2016 11:19:59
Buenos dias.

Estoy tratando de hacer una botonera para mi web y sin embargo, estoy encontrando muchos problemas a la hora de crear los botones. Adjunto código

HTML
1
2
3
4
5
6
7
8
<nav id="f_navegacion">
		<div id="nav_botones">
			<div class="nav_botones_op">xx 1 xx</div>
			<div class="nav_botones_op">xx 2 xx</div>
			<div class="nav_botones_op">xx 3 xx</div>
			<div class="nav_botones_op">xx 4 xx</div>
		</div>
</nav>

CSS
1
2
3
4
		#f_cabecera, #f_navegacion, #f_cuerpo, #f_pie { background: #3939ac; box-shadow: 1px -1px #e0e0eb; border-radius: 12px; margin: 10px; }
		#f_navegacion {  height: 60px; }
		#nav_botones { margin: 0 auto; padding-top: 20px; width: 800px; }
		.nav_botones_op { display: inline; border: 1px solid #91A8D0; width: 600px; height: 30px; border-radius: 5px; margin: 10px; }

No hay manera de que cojan el tamaño que quiero (se ajustan al texto) ni que se centren (evito la etiqueta html center)

¿Que estoy haciendo mal? Gracias de antemano
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 xve

Problema con estilos en DIV

Publicado por xve (1178 intervenciones) el 19/08/2016 18:16:20
Hola Jose, prueba así:
1
2
3
4
5
6
7
8
9
10
11
12
<nav>
	<div id="nav_botones">
		<div class="nav_botones_op">xx 1 xx</div>
		<div class="nav_botones_op">xx 2 xx</div>
		<div class="nav_botones_op">xx 3 xx</div>
		<div class="nav_botones_op">xx 4 xx</div>
	</div>
</nav>
<style>
#nav_botones {text-align: center;}
.nav_botones_op { display: inline-block; border: 1px solid #91A8D0; width: 600px; height: 30px; border-radius: 5px; margin: 10px; }
</style>
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