Problemas visuales con un code

Jue Abr 19, 2018 1:42 pm

Como dice el título, tengo problemas a la hora de la visualización del código expuesto abajo. En definitiva en la visualización de Codepen se ve tal que así

Previsualización Codepen:

Sin embargo al pasarlo al foro en el que quiero usarlo y previsualizarlo todo se descuadra quedandome un horror como este

Previsualización ForoActivo:

Así que bueno... busco vuestro sabio y experto consejo para que me digáis donde me he equivocado, porque estoy convencida de que me he equivocado en algún punto, pero no sé en cual.

Código:: <div class="corpo"><div class="totolo">Plumas perdidas</div><br><br><table><tr><td><div class="imogy" style="background-image:url(http://via.placeholder.com/150x200)"></td><td><div class="toxto">Pellentesque sollicitudin, metus in faucibus pulvinar, dui tortor tincidunt massa, eget pretium justo orci sit amet arcu. Vestibulum quis ante ac enim dictum fermentum. Maecenas sit amet varius libero. Aenean lobortis sagittis ipsum, tincidunt ornare leo sollicitudin a. Phasellus in purus at metus vehicula commodo ut eu nunc. Donec ut felis dolor. Donec quis metus a nisi imperdiet efficitur ut non leo.</td></tr><tr><td><br><div class="imogy" style="background-image:url(http://via.placeholder.com/150x200)"></td><td><div class="toxto">Pellentesque sollicitudin, metus in faucibus pulvinar, dui tortor tincidunt massa, eget pretium justo orci sit amet arcu. Vestibulum quis ante ac enim dictum fermentum. Maecenas sit amet varius libero. Aenean lobortis sagittis ipsum, tincidunt ornare leo sollicitudin a. Phasellus in purus at metus vehicula commodo ut eu nunc. Donec ut felis dolor. Donec quis metus a nisi imperdiet efficitur ut non leo.</td></tr><tr><td><br><div class="imogy" style="background-image:url(http://via.placeholder.com/150x200)"></td><td><div class="toxto">Pellentesque sollicitudin, metus in faucibus pulvinar, dui tortor tincidunt massa, eget pretium justo orci sit amet arcu. Vestibulum quis ante ac enim dictum fermentum. Maecenas sit amet varius libero. Aenean lobortis sagittis ipsum, tincidunt ornare leo sollicitudin a. Phasellus in purus at metus vehicula commodo ut eu nunc. Donec ut felis dolor. Donec quis metus a nisi imperdiet efficitur ut non leo.</td></tr><tr><td><br><div class="imogy" style="background-image:url(http://via.placeholder.com/150x200)"></td><td><div class="toxto">Pellentesque sollicitudin, metus in faucibus pulvinar, dui tortor tincidunt massa, eget pretium justo orci sit amet arcu. Vestibulum quis ante ac enim dictum fermentum. Maecenas sit amet varius libero. Aenean lobortis sagittis ipsum, tincidunt ornare leo sollicitudin a. Phasellus in purus at metus vehicula commodo ut eu nunc. Donec ut felis dolor. Donec quis metus a nisi imperdiet efficitur ut non leo.</td></tr></table></div></div> <style type="text/css">.corpo{height:auto; background:#EC407A;width:400px; padding:40px; outline:1px solid #394341; outline-offset:-20px;}.totolo{text-align:Center; color:#2b74b5; margin-top:5px; font-size:20px; font-weight:900; line-height:11px; text-transform:uppercase;}.imogy{ width:150px; height:200px; border:3px solid #394341; margin-top:-20px;}.toxto{color:#2b74b5; font-size:11px; text-align:justify; padding:10px; width:200px; margin-left:-9px; overflow:auto; font-family:times;}</style>

Jue Abr 19, 2018 2:52 pm

Hola hola, @A girl roler.

Acabo de probar el código que has puesto y en este foro se ve bien, así que posiblemente sea algún problema de conflictos con el foro en el que lo intentas usar. Por ejemplo, en el CSS han puesto que todos los elementos td tengan el borde que aparece en la previsualización. Prueba a ver cómo se ve en otros foros y avísame si el problema persiste; si solo es en ese foro, te ayudaré a arreglarlo.

Edit: Hazle caso a Sao también xD He de reconocer que para el primer diagnóstico miré el code por encima y solo lo previsualicé (?)

Jue Abr 19, 2018 2:59 pm

Hola!
No soy una experta pero intentando ayudar vi tu código. El problema que yo veo es que las etiquetas "div" no se encuentran cerradas. Esto puede ser lo que cause que tu foro no lea el código correctamente.

Código:: <div class="corpo"><div class="totolo">Plumas perdidas</div><br><br><table><tr><td><div class="imogy" style="background-image:url(http://via.placeholder.com/150x200)"></div></td><td><div class="toxto">Pellentesque sollicitudin, metus in faucibus pulvinar, dui tortor tincidunt massa, eget pretium justo orci sit amet arcu. Vestibulum quis ante ac enim dictum fermentum. Maecenas sit amet varius libero. Aenean lobortis sagittis ipsum, tincidunt ornare leo sollicitudin a. Phasellus in purus at metus vehicula commodo ut eu nunc. Donec ut felis dolor. Donec quis metus a nisi imperdiet efficitur ut non leo.</div></td></tr><tr><td><br><div class="imogy" style="background-image:url(http://via.placeholder.com/150x200)"></div></td><td><div class="toxto">Pellentesque sollicitudin, metus in faucibus pulvinar, dui tortor tincidunt massa, eget pretium justo orci sit amet arcu. Vestibulum quis ante ac enim dictum fermentum. Maecenas sit amet varius libero. Aenean lobortis sagittis ipsum, tincidunt ornare leo sollicitudin a. Phasellus in purus at metus vehicula commodo ut eu nunc. Donec ut felis dolor. Donec quis metus a nisi imperdiet efficitur ut non leo.</div></td></tr><tr><td><br><div class="imogy" style="background-image:url(http://via.placeholder.com/150x200)"></div></td><td><div class="toxto">Pellentesque sollicitudin, metus in faucibus pulvinar, dui tortor tincidunt massa, eget pretium justo orci sit amet arcu. Vestibulum quis ante ac enim dictum fermentum. Maecenas sit amet varius libero. Aenean lobortis sagittis ipsum, tincidunt ornare leo sollicitudin a. Phasellus in purus at metus vehicula commodo ut eu nunc. Donec ut felis dolor. Donec quis metus a nisi imperdiet efficitur ut non leo.</div></td></tr><tr><td><br><div class="imogy" style="background-image:url(http://via.placeholder.com/150x200)"></div></td><td><div class="toxto">Pellentesque sollicitudin, metus in faucibus pulvinar, dui tortor tincidunt massa, eget pretium justo orci sit amet arcu. Vestibulum quis ante ac enim dictum fermentum. Maecenas sit amet varius libero. Aenean lobortis sagittis ipsum, tincidunt ornare leo sollicitudin a. Phasellus in purus at metus vehicula commodo ut eu nunc. Donec ut felis dolor. Donec quis metus a nisi imperdiet efficitur ut non leo.</div></td></tr></table></div> <style type="text/css">.corpo{height:auto; background:#EC407A;width:400px; padding:40px; outline:1px solid #394341; outline-offset:-20px;}.totolo{text-align:Center; color:#2b74b5; margin-top:5px; font-size:20px; font-weight:900; line-height:11px; text-transform:uppercase;}.imogy{ width:150px; height:200px; border:3px solid #394341; margin-top:-20px;}.toxto{color:#2b74b5; font-size:11px; text-align:justify; padding:10px; width:200px; margin-left:-9px; overflow:auto; font-family:times;}</style>

Jue Abr 19, 2018 3:57 pm

Gracias por responder tan rápido @Eine Krone y @Sao voy a comprobar si efectivamente están todos los div cerrados, igual creo que al repetir el code de la imagen y el texto... olvidé que debía cerrarlos. Problemas visuales con un code 2802568303

Problemas visuales con un code 2802568303

en caso de que no fuese ese el fallo o incluso arreglandolo se mantuviera espero contar con el buen consejo de Eine...

EDIT: Despues de seguir los consejos de amb@s el code seguía dando el mismo error, le pregunte al wm del foro en el que lo iba a usar por lo de las table y me dijo que no, igualmente se prestó a ayudarme y logró que quedara bien Problemas visuales con un code 3728603767

Problemas visuales con un code 3728603767

Así que doy por cerrado este tema y os agradezco la ayuda mucho

Elementos

Dragon Ball

Pronto

Paraíso Personal

Amor y Amistad

Conejo de Pascua

Problemas visuales con un code