Foros del Web » Creando para Internet » Diseño web »

[SOLUCIONADO] Centrar pseudo elemento

Estas en el tema de Centrar pseudo elemento en el foro de Diseño web en Foros del Web. Buenas, les traigo un problema que no consigo solucionar. Tengo una caja, al cual le agregue un pseudo elemento :before con el fin de lograr ...
  #1 (permalink)  
Antiguo 18/06/2014, 14:44
Avatar de Mariano_Floyd  
Fecha de Ingreso: marzo-2013
Ubicación: Córdoba
Mensajes: 155
Antigüedad: 9 años, 5 meses
Puntos: 14
Centrar pseudo elemento

Buenas, les traigo un problema que no consigo solucionar. Tengo una caja, al cual le agregue un pseudo elemento :before con el fin de lograr un efecto de cuña, pestaña, o como le llamen. El asunto es que no puedo lograr centrarlo verticalmente a la caja padre, queda centrado con respecto a al alto total del documento, pero necesito centrarlo al elemento padre. Aqui les dejo un ejemplo de mi problema:

http://codepen.io/anon/pen/gpFIH
  #2 (permalink)  
Antiguo 18/06/2014, 15:52
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.487
Antigüedad: 20 años
Puntos: 2114
Respuesta: Centrar pseudo elemento

Ponle a .content2 una posición relativa:

Código CSS:
Ver original
  1. .content2 {
  2.   position: relative;
  3. }

Así el elemento hace de referencia para la posición absoluta del pseudo-elemento.
__________________
(:
  #3 (permalink)  
Antiguo 19/06/2014, 10:31
Avatar de Mariano_Floyd  
Fecha de Ingreso: marzo-2013
Ubicación: Córdoba
Mensajes: 155
Antigüedad: 9 años, 5 meses
Puntos: 14
Respuesta: Centrar pseudo elemento

Muchas gracias, funciono a la perfección. No sabia que había que agregarle una position para que haga de referencia. Aprendí algo nuevo hoy xD
  #4 (permalink)  
Antiguo 19/06/2014, 10:41
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.487
Antigüedad: 20 años
Puntos: 2114
Respuesta: Centrar pseudo elemento

Todas las posiciones hacen que el elemento haga de referencia, excepto la estática, que es la que tienen todos por defecto.
__________________
(:
  #5 (permalink)  
Antiguo 19/06/2014, 10:50
Avatar de Mariano_Floyd  
Fecha de Ingreso: marzo-2013
Ubicación: Córdoba
Mensajes: 155
Antigüedad: 9 años, 5 meses
Puntos: 14
Respuesta: Centrar pseudo elemento

Esa lección me va a servir de mucho, ahora entiendo varias cosas que no sabia porque sucedían. Doy el tema como solucionado, muchas gracias pzin.

Etiquetas: elemento, pseudo
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 06:33.