élite + brothersites
El secreto de Gambrinus
vududoll ➹ reviews

Ver el tema anteriorIr abajoVer el tema siguiente
BellaBlackCrews
designer
el Miér Feb 28, 2018 6:00 am
Mensajes :
109


Blood :
32181


Frase :
Paciencia conmigo. Soy novata :3

Hola

Buenos...de nuevo yo la pesada XD
A ver...estoy haciendo una tablita. Y las dos ultimas imagenes (relaciones importantes) por algún motivo, el texto me sale descuadrado. El tamaño es el mismo que las otras (es el mismo código) así que realmente no se porque las dos primeras se ven bien y las otras dos no.
Dejo el codigo:

Código:
<style>@import url('https://fonts.googleapis.com/css?family=Sree+Krushnadevaraya');.cajaentera{text-align:center;background-color:#0B0808; border-left: 10px solid #890000; border-right: 10px solid #890000; width: 500px;}.Titulo{color:#890000;font-size: 25px;font-family: 'Sree Krushnadevaraya';text-align:center; letter-spacing: 3px;}.cajainfo{background-color:#423535;width: 500px;}.cajainfo{width: 500px;height: 200px;}.imagen:hover .informacion{opacity: 1; transition:0.5s linear;-webkit-transform: scale(1);  -ms-transform: scale(1);  -o-transform: scale(1);  transform: scale(1);top:-300}.imagen{overflow:hidden;width: 500px; height: 200px;}.informacion{transition: 0.5s linear;-webkit-transform: scale(0.2);  -ms-transform: scale(0.2);  -o-transform: scale(0.2);  transform: scale(0.2);opacity: 0;margin-top: -250px;background-color: black; background-color: rgba( 0, 0, 0, 0.5);color: white; font-size: 10px; padding-left: 8px; padding-top: 13px;padding-right: 10px; width: 500px; height: 200px;overflow:auto;}.cajalegend{padding: 10px;}.titurelas{color:#890000;font-size: 19px;font-family: 'Sree Krushnadevaraya';text-align:center; letter-spacing: 3px;}
</style>

<div class="cajaentera">
<div class="Titulo">RELACIONES DE FULANITO</div>
<div style="border-bottom: 4px solid #890000;"></div>
<div class="cajainfo"><div class="imagen"><img src="https://78.media.tumblr.com/a02a5e65c6abc4fd802245fdba95ff88/tumblr_onn2mq1T4l1ro0ctvo1_500.gif" width="500px"><div class="informacion">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce eleifend neque ut ligula pellentesque, quis rutrum tellus commodo. Quisque eu purus ac quam feugiat accumsan et et erat. Sed feugiat enim vitae augue mattis, lobortis bibendum velit tincidunt. Mauris non ultricies quam. Pellentesque luctus eget turpis eu ornare. Duis accumsan turpis ut mi volutpat pulvinar. Aenean ac hendrerit turpis. Vestibulum eu dictum elit, sed lacinia sem. Aenean vehicula ornare maximus. Sed tincidunt fermentum odio, et blandit odio. Donec ut cursus velit. Vestibulum porttitor fringilla sapien, efficitur posuere nisl tempus ac. Donec a ullamcorper dui, eu porttitor velit. Aliquam erat volutpat. Aenean ac hendrerit turpis. Vestibulum eu dictum elit, sed lacinia sem. Aenean vehicula ornare maximus. Sed tincidunt fermentum odio, et blandit odio. Donec ut cursus velit. Vestibulum porttitor fringilla sapien, efficitur posuere nisl tempus ac. Donec a ullamcorper dui, eu porttitor velit. Aliquam erat volutpat.</div>
</div>
</div>
<div class="cajalegend">[color=#5C0101]Civiles[/color] - [color=#B8B8B8]Luciernagas[/color] - [color=#0A4D00]Militares[/color] - [color=#455459]Saqueadores[/color] - [color=#A82700]Sectarios[/color] - [color=#B8A007]Viejo gobierno[/color] - [color=#6EB3CC]Nuevo gobierno[/color] - [color=#C70808]Inmunes[/color]</div>
<div class="titurelas">[u]RELACIONES AMISTOSAS[/u]</div>
[b]Amigos de la infancia[/b]
[i]"Nos conocemos desde niños y nos hemos criado juntos"[/i]
-
-
[b]Amigos de conveniencia[/b]
[i]"Cuando me interesa eres mi amigo y cuando no, no."[/i]
-
-
[b]Amigos de copas[/b]
[i]"Con quien tomo algo. No solemos vernos fuera del local"[/i]
-
-
[b]Conocidos[/b]
[i]"Apenas nos conocemos"[/i]
-
-
<div class="titurelas">[u]RELACIONES ROMÁNTICAS[/u]</div>

[b]Amigos con derechos[/b]
[i]"Solo somos buenos amigos pero sabemos divertirnos juntos"[/i]
-
-
[b]Amor plátonico[/b]
[i]"Se que es imposible que estemos juntos pero me encantas"[/i]
-
-
[b]Lio de una noche[/b]
[i]"Probablemente no se vuelva a repetir"[/i]
-
-
<div class="titurelas">[u]RELACIONES HOSTILES[/u]</div>

[b]Enemigos[/b]
[i]"No nos aguantamos ni hacemos nada por disimularlo"[/i]
-
-
<div class="Titulo">RELACIONES IMPORTANTES</div>
<div style="border-bottom: 4px solid #890000;"></div>
<div class="cajainfo"><div class="imagen"><img src="https://78.media.tumblr.com/a87667303e61ce96720122caaf3e1827/tumblr_oq5ux28o1R1ukxfh9o2_500.gif" width="500px"><div class="informacion">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce eleifend neque ut ligula pellentesque, quis rutrum tellus commodo. Quisque eu purus ac quam feugiat accumsan et et erat. Sed feugiat enim vitae augue mattis, lobortis bibendum velit tincidunt. Mauris non ultricies quam. Pellentesque luctus eget turpis eu ornare. Duis accumsan turpis ut mi volutpat pulvinar. Aenean ac hendrerit turpis. Vestibulum eu dictum elit, sed lacinia sem. Aenean vehicula ornare maximus. Sed tincidunt fermentum odio, et blandit odio. Donec ut cursus velit. Vestibulum porttitor fringilla sapien, efficitur posuere nisl tempus ac. Donec a ullamcorper dui, eu porttitor velit. Aliquam erat volutpat. Aenean ac hendrerit turpis. Vestibulum eu dictum elit, sed lacinia sem. Aenean vehicula ornare maximus. Sed tincidunt fermentum odio, et blandit odio. Donec ut cursus velit. Vestibulum porttitor fringilla sapien, efficitur posuere nisl tempus ac. Donec a ullamcorper dui, eu porttitor velit. Aliquam erat volutpat.</div>
</div>
</div>
-------
<div class="cajainfo"><div class="imagen"><img src="https://78.media.tumblr.com/ef266f065e63b82276bbc3e1b91aba8f/tumblr_oqmpma6P7g1t00bifo5_r1_500.gif" width="500px"><div class="informacion">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce eleifend neque ut ligula pellentesque, quis rutrum tellus commodo. Quisque eu purus ac quam feugiat accumsan et et erat. Sed feugiat enim vitae augue mattis, lobortis bibendum velit tincidunt. Mauris non ultricies quam. Pellentesque luctus eget turpis eu ornare. Duis accumsan turpis ut mi volutpat pulvinar. Aenean ac hendrerit turpis. Vestibulum eu dictum elit, sed lacinia sem. Aenean vehicula ornare maximus. Sed tincidunt fermentum odio, et blandit odio. Donec ut cursus velit. Vestibulum porttitor fringilla sapien, efficitur posuere nisl tempus ac. Donec a ullamcorper dui, eu porttitor velit. Aliquam erat volutpat. Aenean ac hendrerit turpis. Vestibulum eu dictum elit, sed lacinia sem. Aenean vehicula ornare maximus. Sed tincidunt fermentum odio, et blandit odio. Donec ut cursus velit. Vestibulum porttitor fringilla sapien, efficitur posuere nisl tempus ac. Donec a ullamcorper dui, eu porttitor velit. Aliquam erat volutpat.</div>
</div>
</div>
----------
<div class="cajainfo"><div class="imagen"><img src="https://78.media.tumblr.com/03d2d8a0df653b54b98c2276cc010318/tumblr_p260qeater1qkjtwuo2_1280.gif" width="500px"><div class="informacion">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Fusce eleifend neque ut ligula pellentesque, quis rutrum tellus commodo. Quisque eu purus ac quam feugiat accumsan et et erat. Sed feugiat enim vitae augue mattis, lobortis bibendum velit tincidunt. Mauris non ultricies quam. Pellentesque luctus eget turpis eu ornare. Duis accumsan turpis ut mi volutpat pulvinar. Aenean ac hendrerit turpis. Vestibulum eu dictum elit, sed lacinia sem. Aenean vehicula ornare maximus. Sed tincidunt fermentum odio, et blandit odio. Donec ut cursus velit. Vestibulum porttitor fringilla sapien, efficitur posuere nisl tempus ac. Donec a ullamcorper dui, eu porttitor velit. Aliquam erat volutpat. Aenean ac hendrerit turpis. Vestibulum eu dictum elit, sed lacinia sem. Aenean vehicula ornare maximus. Sed tincidunt fermentum odio, et blandit odio. Donec ut cursus velit. Vestibulum porttitor fringilla sapien, efficitur posuere nisl tempus ac. Donec a ullamcorper dui, eu porttitor velit. Aliquam erat volutpat.</div>
</div>
</div>
</div>

¡Gracias de antemano!
Ver perfil de usuario
Mensajes :
109


Blood :
32181


Frase :
Paciencia conmigo. Soy novata :3

Hola

Roshio
webmaster
el Miér Feb 28, 2018 4:19 pm
Mensajes :
2117


Blood :
620314


Frase :

red
F I R E
wings

Texto que se descuadra en hover H-2

Texto que se descuadra en hover 1000mensajes Texto que se descuadra en hover 75_Reputacion Texto que se descuadra en hover ILoveDix Texto que se descuadra en hover Inmortal Texto que se descuadra en hover Soporte Texto que se descuadra en hover Hacer_Tutorial Texto que se descuadra en hover Subir_Recurso Texto que se descuadra en hover Aportacion Texto que se descuadra en hover Consejo Texto que se descuadra en hover Tutorial_Code Texto que se descuadra en hover Resuelve_Dudas

Hola Bella, lo siento me confundi con tu código, tienes algunas cosas repetidas y otras que siento que sobran, y estuve tratando de encontrar el problema pero creo que mejor te paso otro código nuevo más básico que podria servirte y tu compararlo con el tuyo en las partes que necesitas,
espero que te sirva Texto que se descuadra en hover 1f61f

https://jsfiddle.net/0zvaenau/9/

Ver perfil de usuario
Mensajes :
2117


Blood :
620314


Frase :

red
F I R E
wings

Texto que se descuadra en hover H-2

Texto que se descuadra en hover 1000mensajes Texto que se descuadra en hover 75_Reputacion Texto que se descuadra en hover ILoveDix Texto que se descuadra en hover Inmortal Texto que se descuadra en hover Soporte Texto que se descuadra en hover Hacer_Tutorial Texto que se descuadra en hover Subir_Recurso Texto que se descuadra en hover Aportacion Texto que se descuadra en hover Consejo Texto que se descuadra en hover Tutorial_Code Texto que se descuadra en hover Resuelve_Dudas

BellaBlackCrews
designer
el Jue Mar 01, 2018 4:19 am
Mensajes :
109


Blood :
32181


Frase :
Paciencia conmigo. Soy novata :3

Hola

¡Hola! Gracias por tomarte la molestia. Lo cierto es que es verdad que tu código está mas simlificado. Pero me encuentro un problema. El div Image la idea es que se pongan imagenes distintas y con este código solo se puede poner una ¿no? ¿O hay alguna imagen de poder hacer que cada imagen sea diferente?
Ver perfil de usuario
Mensajes :
109


Blood :
32181


Frase :
Paciencia conmigo. Soy novata :3

Hola

BellaBlackCrews
designer
el Jue Mar 01, 2018 2:12 pm
Mensajes :
109


Blood :
32181


Frase :
Paciencia conmigo. Soy novata :3

Hola

Al final lo que he echo ha sido copiar el apartado Image y ponerle nombres del tipo image1, Image2 y así poner cada background. Algo chapuzero, lo se. Si hay otro modo de hacerlo soy toda oidos (o ojos mejor XD )
Ver perfil de usuario
Mensajes :
109


Blood :
32181


Frase :
Paciencia conmigo. Soy novata :3

Hola

Roshio
webmaster
el Vie Mar 02, 2018 9:59 am
Mensajes :
2117


Blood :
620314


Frase :

red
F I R E
wings

Texto que se descuadra en hover H-2

Texto que se descuadra en hover 1000mensajes Texto que se descuadra en hover 75_Reputacion Texto que se descuadra en hover ILoveDix Texto que se descuadra en hover Inmortal Texto que se descuadra en hover Soporte Texto que se descuadra en hover Hacer_Tutorial Texto que se descuadra en hover Subir_Recurso Texto que se descuadra en hover Aportacion Texto que se descuadra en hover Consejo Texto que se descuadra en hover Tutorial_Code Texto que se descuadra en hover Resuelve_Dudas

Solo tienes que hacer esto en el HTML, pones una imagen diferente en cada div con el nombre Image que necesites, sin tener que repetir o hacer más divs, aunque tambien si eso te sirve puedes hacerlo Texto que se descuadra en hover 1f600 Texto que se descuadra en hover 1f44c

Código:

<div class="Image" style="background-image:url(linkaqui);">Texto</div>










Ver perfil de usuario
Mensajes :
2117


Blood :
620314


Frase :

red
F I R E
wings

Texto que se descuadra en hover H-2

Texto que se descuadra en hover 1000mensajes Texto que se descuadra en hover 75_Reputacion Texto que se descuadra en hover ILoveDix Texto que se descuadra en hover Inmortal Texto que se descuadra en hover Soporte Texto que se descuadra en hover Hacer_Tutorial Texto que se descuadra en hover Subir_Recurso Texto que se descuadra en hover Aportacion Texto que se descuadra en hover Consejo Texto que se descuadra en hover Tutorial_Code Texto que se descuadra en hover Resuelve_Dudas

Contenido patrocinado
Ver el tema anteriorVolver arribaVer el tema siguiente
Permisos de este foro:
No puedes responder a temas en este foro.
Copyrighted.com Registered & Protected