Iniciar sesiónCerrar
Correo:
Contraseña:
Entrar
Recordar sesión en este navegador
Iniciar sesiónIniciar sesiónCrear cuentaCrear cuenta
LWP » Foros » CSS » centrar enlace en div y que ocupe 100%

CSS - centrar enlace en div y que ocupe 100%

Volver
Nuevo Tema
<<>>
 
Vista:
Imágen de perfil de Fernando
Val: 13
Ha aumentado su posición en 5 puestos en CSS (en relación al último mes)
Gráfica de CSS

centrar enlace en div y que ocupe 100%

Publicado por Fernando (7 intervenciones) el 09/05/2017 16:35:26
Hola, tengo un div en el cual tiene un enlace y lo que quiero es que el enlace esté centrado horizontal y verticalmente y que ocupe el 100% del div.
Les dejo el código que tengo hasta ahora
https://codepen.io/fernando143/pen/YVYMJB

Sé que podría meter el div dentro del enlace pero eso no es correcto.
Esto es una tontería yo lo sabía hacer pero no me acuerdo.


Saludos
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
sin imagen de perfil

centrar enlace en div y que ocupe 100%

Publicado por isabel (3 intervenciones) el 09/05/2017 19:36:11
Hola!
Puedes hacerlo con display:table / display:table-cell:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
.N5{
	background-color: #3b877f;

	width: 500px;
	height: 80px;
	display: table;
  margin: 0 auto;
	justify-content: center;
	align-items: center;
}
.N5 a{
  width: 100%;
  text-align: center;
  display:table-cell;
  vertical-align: middle;
}

O si quieres dejar el .N5 tal y como estaba, así:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
.N5{
	background-color: #3b877f;

	width: 500px;
	height: 80px;
	display: flex;
  margin: 0 auto;
	justify-content: center;
	align-items: center;
}
.N5 a{
  width: 100%;
  text-align: center;
  background:yellow;
  display: inline-block;
  padding:32px;
}

es lo que se me ocurre!
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
2
Comentar
Imágen de perfil de Fernando
Val: 13
Ha aumentado su posición en 5 puestos en CSS (en relación al último mes)
Gráfica de CSS

centrar enlace en div y que ocupe 100%

Publicado por Fernando (7 intervenciones) el 09/05/2017 23:45:23
Gracias a todos por sus respuestas.
En particular me sirvio lo de text-align: center.

Me había olvidado de eso!
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