[Duda] Resuelto | Dimensiones de tablilla distorsionadas

Dom Ago 12, 2018 5:27 pm

¡Hola!

Lo sé, parece que la zona que más uso del foro es esta TnT pero realmente no puedo evitarlo, después de tanto tiempo quise volver a subir un aporte al foro para no estar solo haciendo tutoriales y no mostrar resultados, así que decidí hacer una pequeña firma y bueno al colocarla en el foro se veía realmente mal, pero en codepen no.
Así se ve en codepen: Así

Pero cuando lo subo aquí se ve así:

Código:: <link href='http://fonts.googleapis.com/css?family=Merriweather' rel='stylesheet' type='text/css'><link href='http://fonts.googleapis.com/css?family=Open Sans' rel='stylesheet' type='text/css'> <div class="chaotic"><center><table><tbody><tr><td><a class="angel" href="/"><div class="Demon" style="background: url(http://via.placeholder.com/100x100);"><div class="nephilim">Ficha</div></div></a></td><td><a class="angel" href="/"><div class="Demon" style="background: url(http://via.placeholder.com/100x100);"><div class="nephilim">Cronología</div><div></td><td><a class="angel" href="/"><div class="Demon" style="background: url(http://via.placeholder.com/100x100);"><div class="nephilim">Relaciones</div></div></a></td></tr></tbody></table></center> <div class="yaname"><span style="font-family: 'Merriweather', sans, serif; font-size: 50px; color: #F5B7B1; "><i><b>I</b></i></span>'ts too late for you</div><div class="vampire"><i>Can you hear a man hammering his face against the door? he is to numb to use his hands</i></div></div> <a href="http://dixinmortal.catsboard.com/u1562" class="witch" title="By The witch"></a>

Entonces no sé realmente lo que estoy haciendo mal porque cuando lo subo a otro foro sale normal, justo como debería verse. [Duda] Resuelto | Dimensiones de tablilla distorsionadas 2996817631

[Duda] Resuelto | Dimensiones de tablilla distorsionadas 2996817631

Gracias por leer y disculpen las molestias. [Duda] Resuelto | Dimensiones de tablilla distorsionadas 3977329451

Edit1: he incluso después de intentar publicarlo en spoiler para que no se viera la fealdah(?) incluso distorsionó el foro [Duda] Resuelto | Dimensiones de tablilla distorsionadas 3806464160

[Duda] Resuelto | Dimensiones de tablilla distorsionadas 3806464160

Dom Ago 12, 2018 11:11 pm

EDIT: A caray, cuando quise enviar el mensaje no sale completo así que lo pondré rápido y sencillo aquí arriba... Necesitas borrar el code de demostración para que salga todo mi mensaje xD! Igual te enviaré un MP para que pueda llegarte fácil la aclaración.

Primero: citando tu texto para ver que errores tenía y lo primero que noté fueron dos cosas:
Uno: Colocas un td antes de cerrar el link a de la cronología así que daña un poco el code.
Dos: No cierras el div de chaotic nunca lo cierras así como el center.

Intenta cambiar el code que pusiste de ejemplo (incluido el link a la página de codepen para que te salga bonito) por este de aquí abajo... o si gustas probarlo en un foro aparte no hay problema, es tu code con algunas modificaciones para que luzca sin necesidad de jalar una página extra.

Código:: <link href='http://fonts.googleapis.com/css?family=Merriweather' rel='stylesheet' type='text/css'><link href='http://fonts.googleapis.com/css?family=Open Sans' rel='stylesheet' type='text/css'><div class="chaotic"> <table><tr><td><a class="angel" href="/"><div class="Demon" style="background: url(http://via.placeholder.com/100x100);"><div class="nephilim">Ficha</div></div></a></td><td><a class="angel" href="/"><div class="Demon" style="background: url(http://via.placeholder.com/100x100);"><div class="nephilim">Cronología</div><div></a></td><td><a class="angel" href="/"><div class="Demon" style="background: url(http://via.placeholder.com/100x100);"><div class="nephilim">Relaciones</div></div></a></td></tr></table><div class="yaname"><span style="font-family: 'Merriweather', sans, serif; font-size: 50px; font-style: oblique; color: #F5B7B1; font-weight: 900;">I</span>'ts too late for you</div> <div class="vampire">Can you hear a man hammering his face against the door? he is to numb to use his hands</div><a href="http://dixinmortal.catsboard.com/u1562" class="witch" title="By The witch">

Lun Ago 13, 2018 9:59 am

¡Hola, The Witch! El motivo porque no aparece tu tablilla al publicarla aquí y deforma el foro es que tienes muchas balizas abiertas, te recomiendo revisar una por una y cerrarlas todas, otro motivo es que solo colocaste el HTML pero no el CSS por eso no se ve la "estilizacion" de tu tablilla, solo el texto crudo del HTML.

[Duda] Resuelto | Dimensiones de tablilla distorsionadas 1002464352

[Duda] Resuelto | Dimensiones de tablilla distorsionadas 1002464352

[Duda] Resuelto | Dimensiones de tablilla distorsionadas 3983034393

Lun Ago 13, 2018 6:54 pm

¡Hola!

Gracias por responder! [Duda] Resuelto | Dimensiones de tablilla distorsionadas 2802568303

, ya chequé todo y sigue saliendo fea TnT.
Cerré todas las balizas, quite los center por que ya no los necesitaba y en vez de poner el link puse etiqueta de style y aun con eso sigue saliendo mal, pero en codepen, en fiddle y un ptra pagina prueba se ve bien TnT.

Así me quedó el code ya editado: https://codepen.io/Yan1/pen/wxOKEJ

Edit 1: incluso cuando quiero poner el code completo en code no me deja xD y cuando le doy editar me distorsiona todo el code como si no reconociera los caracteres.

[Duda] Resuelto | Dimensiones de tablilla distorsionadas 2996817631

Mar Ago 14, 2018 11:03 am

Hola The Witch, note los siguientes errorcitos:

1) El código CSS debe ir dentro de las balizas de style y tu las tienes vacías, tambien este texto de darle estilo propio se pone solo en el CSS y tu lo tienes fuera por lo que se lee como texto general.

[Duda] Resuelto | Dimensiones de tablilla distorsionadas 67mhom

[Duda] Resuelto | Dimensiones de tablilla distorsionadas 67mhom

2) Dejaste un espacio entre los elementos que hace que no se lea el código:
[Duda] Resuelto | Dimensiones de tablilla distorsionadas 35338na

Te dejo este tutorial de como subir un código a un post, espero te sirva.

Nota: Recuerda que el código sale "deforme" por que la plataforma de ModernBB lee los códigos de forma más pura que en las plataformas phpbb3 que es la mas usual. Para leer más al respecto te invito a echar un ojo a este tema.

[Duda] Resuelto | Dimensiones de tablilla distorsionadas 1635427974

[Duda] Resuelto | Dimensiones de tablilla distorsionadas 1635427974

EDIT: Tuve que quitar el codigo porque sigue rompiendo el foro por algun motivo, ya le di mil vueltas y no consigo encontrar lo que genera el error, asi que probaré con un código nuevo desde 0.

Mar Ago 14, 2018 11:30 am

Hice de nuevo el codigo de 0 y asi me quedo:

Y ahora para subirlo a un post solo tenemos que quitar todos los espacios y añadir la etiqueta style para el CS:

Texto

● Coloca una frase aquí ●
ahora una subfrase aqui

Código:: <center> <div class="Principe"><table><tbody><tr><td><div class="Corona" style="background-image:url(https://2img.net/h/i1190.photobucket.com/albums/z455/takonasu/07/1.png);"><a href="#" class="Real">Texto</a></div></td><td><div class="Corona" style="background-image:url(https://2img.net/h/i1190.photobucket.com/albums/z455/takonasu/07/29.png);"><a href="#" class="Real">Texto</a></div></td><td><div class="Corona" style="background-image:url(https://2img.net/h/i1190.photobucket.com/albums/z455/takonasu/07/225.png);"><a href="#" class="Real">Texto</a></div></td></tr></tbody></table></div> <div class="Princesa">● Coloca una frase aquí ● <br/><span style="font-size:8px; font-family:calibri; letter-spacing:2px;text-transform:uppercase;">ahora una subfrase aqui</span></div> </center> <style>.Principe { width:375px; height:125px; background:#eee; padding:10px; border:1px solid #ddd;} .Corona { width:100px; height:100px; border:10px white solid; background:white; overflow:hidden;} a.Real { width:100%; display:block; height:100%; padding-top:45px; font-size:10px; font-family: calibri; text-align:center; text-decoration:none; text-transform:uppercase; background: rgba(0,0,0,0.8); color:white; opacity:0; transition:1s ease; transform: scale(0,5);} .Corona:hover a.Real { opacity:1; transform:scale(1); transition:1s ease;} .Princesa { margin-top:15px; line-height:12px; font-family: Georgia; font-size:20px; font-weight:bolder; font-style:italic;}</style>

Jue Ago 16, 2018 12:38 am

Gracias por las aclaraciones Roshio, ya le di un vistazo al tema y trataré de rehacerlo a ver si esta vez si me deja hacerlo bien, le correjí todos los errores y ello pero... desgraciadamente me seguía saliendo solo el html TnT no se por que estas cosas me pasan a mi, pero bueno, trataré de hacer un trabajo más limpio.

¡Muchas gracias a las dos! [Duda] Resuelto | Dimensiones de tablilla distorsionadas 2531292851

[Duda] Resuelto | Dimensiones de tablilla distorsionadas 2531292851

Próx

Bridgerton

Luz vs Oscuridad

Paraíso Personal

Amor y Amistad

Conejo de Pascua

[Duda] Resuelto | Dimensiones de tablilla distorsionadas