Foros del Web » Creando para Internet » CSS »

[SOLUCIONADO] Hacer que pase una línea por encima de un div con ::before

Estas en el tema de Hacer que pase una línea por encima de un div con ::before en el foro de CSS en Foros del Web. Buenas, he visto que se puede hacer que pase una línea por la mitad de un div verticalmente con ::before, pero no consigo hallar como. ...
  #1 (permalink)  
Antiguo 15/02/2015, 14:28
 
Fecha de Ingreso: julio-2011
Ubicación: Canarias
Mensajes: 171
Antigüedad: 12 años, 8 meses
Puntos: 4
Hacer que pase una línea por encima de un div con ::before

Buenas, he visto que se puede hacer que pase una línea por la mitad de un div verticalmente con ::before, pero no consigo hallar como. ¿Alguien tiene idea?

Muchas gracias, un saludo.
  #2 (permalink)  
Antiguo 15/02/2015, 15:51
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 8 meses
Puntos: 2114
Respuesta: Hacer que pase una línea por encima de un div con ::before

Algo así debiera de valer:

Código CSS:
Ver original
  1. div {
  2.   position: relative;
  3.   height: 456px;
  4. }
  5.  
  6. div:before {
  7.   position: absolute;
  8.   top: 0;
  9.   left: 0;
  10.   width: 100%;
  11.   height: 1px;
  12.   background: #000;
  13.   content: '';
  14.   transition: top .5s;
  15. }
  16.  
  17. div:hover:before {
  18.   top: 100%;
  19. }

Añádese los prefijos propietarios pertinentes.
__________________
(:
  #3 (permalink)  
Antiguo 15/02/2015, 16:16
 
Fecha de Ingreso: julio-2011
Ubicación: Canarias
Mensajes: 171
Antigüedad: 12 años, 8 meses
Puntos: 4
Respuesta: Hacer que pase una línea por encima de un div con ::before

Perfecto, pero tengo un problema... si pongo height: 1px; solo me hace un pixel, peor yo quiero que cubra todo el div. El problema es que le div cambia, es decir, que se hace más grande o más pequeño cada vez que entras a la web, porque cambiar en función de unas variables....
  #4 (permalink)  
Antiguo 15/02/2015, 16:49
Avatar de pzin
Moderata 😈
 
Fecha de Ingreso: julio-2002
Ubicación: Islas Canarias
Mensajes: 10.488
Antigüedad: 21 años, 8 meses
Puntos: 2114
Respuesta: Hacer que pase una línea por encima de un div con ::before

Entonces dale una altura de 100% pero ya no es una línea.
__________________
(:
  #5 (permalink)  
Antiguo 15/02/2015, 17:07
 
Fecha de Ingreso: julio-2011
Ubicación: Canarias
Mensajes: 171
Antigüedad: 12 años, 8 meses
Puntos: 4
Respuesta: Hacer que pase una línea por encima de un div con ::before

Hombre, con una línea me refería a una raya jaja.

El problema realmente no era ese, era que si le daba 100% de height se me generaba otro error, pero de todas formas ya está solucionado.. Gracias!

Etiquetas: encima, pase
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 17:53.