Detalhes da questão

Endereço do fórum: http://nrpgbr.forumeiros.com/t305-1-personagens
Versão do fórum: ModernBB

Descrição

Estou tendo um problema que acontece com vários códigos quando tento realocá-los de fóruns que utilizam a versão punBB. O resultado nunca é o mesmo. Vejam:

https://i.imgur.com/UK1FNfC.png modernbb
https://i.imgur.com/BTlH5AN.png punbb

Sei que é possível editá-los para ficarem iguais, mas isso daria trabalho já que não é um único código. Será que é possível fazer alguma mudança no fórum em si (sem alternar a versão para PunBB) que faria todos os códigos funcionarem como nas versões punBB?

Olá!

Poderia nos fornecer o seu CSS em tópico, por favor?

Até mais.

Tópico movido de 'Questões sobre códigos' para 'Questões sobre a aparência do fórum'.

Eu não sei bem se é o que você queria, mas o código nas imagens é este:

Código:

<center><style type="text/css">div::-webkit-scrollbar { height: 32px; width: 5px; background: #EEEEEE; } div::-webkit-scrollbar-thumb { background: #A7122F;border: 1px solid #000; } div::-webkit-scrollbar-track { background:#000;} div::-webkit-scrollbar-button {background:#000;}b{color:#ddd; text-transform:uppercase;}.miko1{width:500px;height:880px;overflow:hidden;background:#000;}.buki{background-image: url(https://41.media.tumblr.com/35c10adb69134635381e31a03791fb53/tumblr_o5d4hjbAL21rl3tlpo1_1280.jpg); width:500px;height:802px;transition-duration: .6s; -webkit- transition-duration: .6s; -moz- transition-duration: .6s; -ms- transition-duration: .6s; -o- transition-duration: .6s; transform: rotate(0deg); -webkit-transform: rotate(0deg); -moz-transform: rotate(0deg); -ms-transform: rotate(0deg); -o-transform: rotate(0deg); margin-top:80px;}.todi:hover .buki{ width: 200px; height: 200px; background-image: url(http://66.media.tumblr.com/5f709143fd201f82af40951fc702d332/tumblr_o5f14ljEPj1sir5cqo4_400.gif); border:7px solid #000;transform: rotate(360deg); -webkit-transform: rotate(360deg); -moz-transform: rotate(360deg); -ms-transform: rotate(360deg); -o-transform: rotate(360deg);border-radius:100%;}.todi{overfow:hidden;width:500px;height:880px;border: 5px solid #000;outline: 1px solid #A7122F;color:#fff;}.datos {margin: 2px;background: #A7122F;width: 225px;text-transform:uppercase;height:15px;color:#ddd;padding-top: 4px;text-align:center;padding-bottom: 4px;line-height: 100%; font-family: calibri;font-size: 12px;}.mikee {font-family: Open Sans Condensed;font-size: 30px;font-weight: 700; position: relative;text-transform:uppercase;top: 38px;width: 600px;color: #A7122F;text-shadow: -1px -1px 0 #000, 1px -1px 0 #000, -1px 1px 0 #000, 1px 1px 0 #000;text-align: justify;left: -280px;}</style>

<link href='https://fonts.googleapis.com/css?family=Open+Sans+Condensed:300' rel='stylesheet' type='text/css'><div class="todi"><div style="width: 0;height: 80px;border-left: 500px solid rgba(0, 0, 0, 0);border-bottom: 100px solid #000;background:#A7122F;position:absolute;"><div class="mikee">Nombre del personaje</div></div><div class="miko1"><div class="buki"></div><div style="width:460px;height:600px;padding:20px;overflow:auto;margin-top:-35px;"><table><tr><td><div class="datos">Nombre del personaje</div><div class="datos">Experiencia</div><div class="datos">Nivel</div><div class="datos">Apodo</div><div class="datos">Edad</div><div class="datos">Sexo</div><div class="datos">Rango</div><div class="datos">Rango Social</div><div class="datos">Alineamiento</div><div class="datos">Banda</div></td><td><div style="padding:10px;border:2px solid #A7122F;width:200px;height:220px;text-align:justify;overflow:auto;font-family:Open Sans Condensed;font-size:14px;">Blandit incorrupte quaerendum in quo, nibh impedit id vis, vel no nullam semper audiam. Ei populo graeci consulatu mei, has ea stet modus phaedrum. Inani oblique ne has, duo et veritus detraxit. Tota ludus oratio ea mel, offendit persequeris ei vim. Eos dicat oratio partem ut, id cum ignota senserit intellegat. Sit inani ubique graecis ad, quando graecis liberavisse et cum, dicit option eruditi at duo. Homero salutatus suscipiantur eum id, tamquam voluptaria expetendis ad sed, nobis feugiat similique usu ex.</div></td></tr><tr><td><div style="padding:10px;border:2px solid #A7122F;width:200px;height:150px;text-align:justify;overflow:auto;font-family:Open Sans Condensed;font-size:14px;"><b>Descripción Psicologica</b> Blandit incorrupte quaerendum in quo, nibh impedit id vis, vel no nullam semper audiam. Ei populo graeci consulatu mei, has ea stet modus phaedrum. Inani oblique ne has, duo et veritus detraxit. Tota ludus oratio ea mel, offendit persequeris ei vim. Eos dicat oratio partem ut, id cum ignota senserit intellegat. Sit inani ubique graecis ad, quando graecis liberavisse et cum, dicit option eruditi at duo. Homero salutatus suscipiantur eum id, tamquam voluptaria expetendis ad sed, nobis feugiat similique usu ex.</div></td><td><div style="padding:10px;border:2px solid #A7122F;width:200px;height:150px;text-align:justify;overflow:auto;font-family:Open Sans Condensed;font-size:14px;"><b>Descripción Física</b>
Blandit incorrupte quaerendum in quo, nibh impedit id vis, vel no nullam semper audiam. Ei populo graeci consulatu mei, has ea stet modus phaedrum. Inani oblique ne has, duo et veritus detraxit. Tota ludus oratio ea mel, offendit persequeris ei vim. Eos dicat oratio partem ut, id cum ignota senserit intellegat. Sit inani ubique graecis ad, quando graecis liberavisse et cum, dicit option eruditi at duo. Homero salutatus suscipiantur eum id, tamquam voluptaria expetendis ad sed, nobis feugiat similique usu ex.</div></td></tr><tr><td><div style="padding:10px;border:2px solid #A7122F;width:200px;height:150px;text-align:justify;overflow:auto;font-family:Open Sans Condensed;font-size:14px;"><b>Descripción Psicologica</b> Blandit incorrupte quaerendum in quo, nibh impedit id vis, vel no nullam semper audiam. Ei populo graeci consulatu mei, has ea stet modus phaedrum. Inani oblique ne has, duo et veritus detraxit. Tota ludus oratio ea mel, offendit persequeris ei vim. Eos dicat oratio partem ut, id cum ignota senserit intellegat. Sit inani ubique graecis ad, quando graecis liberavisse et cum, dicit option eruditi at duo. Homero salutatus suscipiantur eum id, tamquam voluptaria expetendis ad sed, nobis feugiat similique usu ex.</div></td><td><div style="padding:10px;border:2px solid #A7122F;width:200px;height:150px;text-align:justify;overflow:auto;font-family:Open Sans Condensed;font-size:14px;"><b>Descripción Física</b>
Blandit incorrupte quaerendum in quo, nibh impedit id vis, vel no nullam semper audiam. Ei populo graeci consulatu mei, has ea stet modus phaedrum. Inani oblique ne has, duo et veritus detraxit. Tota ludus oratio ea mel, offendit persequeris ei vim. Eos dicat oratio partem ut, id cum ignota senserit intellegat. Sit inani ubique graecis ad, quando graecis liberavisse et cum, dicit option eruditi at duo. Homero salutatus suscipiantur eum id, tamquam voluptaria expetendis ad sed, nobis feugiat similique usu ex.</div></td></tr></table><div style="padding:10px;border:2px solid #A7122F;width:440px;height:130px;text-align:justify;overflow:auto;font-family:Open Sans Condensed;font-size:14px;"><b>Historia</b> Blandit incorrupte quaerendum in quo, nibh impedit id vis, vel no nullam semper audiam. Ei populo graeci consulatu mei, has ea stet modus phaedrum. Inani oblique ne has, duo et veritus detraxit. Tota ludus oratio ea mel, offendit persequeris ei vim. Eos dicat oratio partem ut, id cum ignota senserit intellegat. Sit inani ubique graecis ad, quando graecis liberavisse et cum, dicit option eruditi at duo. Homero salutatus suscipiantur eum id, tamquam voluptaria expetendis ad sed, nobis feugiat similique usu ex.</div></div></div></div><div style="margin-bottom: 5px;width: 520px; padding: 10px; text-transform: uppercase;font-family: 'Text Me One', sans-serif;letter-spacing: 2px;font-size: 10px; text-align: center; line-height; 30px;text-decoration:none;"><a href="http://mikaeuniverse.tumblr.com/">Mikae © Tumblr</a></div></center>

E o css do meu fórum é esse:

Código:

/*bg fundo*/
.forumbg_table_rpn {
background-color: #595959;
background-image: url(http://i.imgur.com/Clvc7.jpg);
background-position: 0 0;
background-repeat: repeat-x;
border: 0px solid #edf0f2;
clear: both;
margin-bottom: 4px;
padding: 0 5px;
}

.headerbar {
    background-color: transparent!important;
    background-image: none!important;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 350px;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position: relative;
}

/*Hover imagenes*/
#tabli:hover {
  opacity: 100;
  transition: .3s all ease-in-out;
  transition-delay: .3s;
  transition-duration: .3s;
}
#tabli {
  background-color: #9C0808;
  color: #FFF;
  font-family: arial;
  font-size: 9px;
  height: 80px;
  letter-spacing: 2px;
  line-height: 145%;
  opacity: 0;
  overflow: hidden;
  padding: 15px;
  text-align: justify;
  transition: .3s all ease-in-out;
  transition-delay: .3s;
  transition-duration: .3s;
  width: 70px;
}
/*CAJAS TABLON*/
.cnt2{
display:none;
    margin:20px;
}
.cnt1 strong, .cnt2 strong, .cnt3 strong, .contenido2 strong {color: #9C0808;
  font-family: terminal dosis light;
  font-size: 40px;  text-align: center;
  text-transform: uppercase;
  font-weight: 700;letter-spacing: -4px;}
#mika3 {
  background: #000;
  color: #fff;
  display: block;
  font-family: calibri;
  font-size: 10px;
  overflow: auto;
  text-align: justify;
  height: 100px;
  letter-spacing: 2px;
  margin: 20px;
  padding: 10px;
  width: 165px;
}#mika4 {
  background: #000;
  color: #fff;
  display: block;
  font-family: calibri;
  font-size: 10px;
  overflow: auto;
  text-align: justify;
  height: 150px;
  letter-spacing: 2px;
  margin: 20px;
  padding: 10px;
  width: 165px;
}
.cnt1 {margin:20px;
}
.cnt3{
display: none;margin:20px;
}#mikatitle {
  -moz-transform: rotate(-90deg);
  -ms-transform: rotate(-90deg);
  -o-transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
  background: #000;
  color: #9C0808;
  font-family: terminal dosis light;
  font-size: 40px;
  font-weight: 700;
  text-transform:uppercase;
  letter-spacing: -4px;
  margin-left: -270px;
  padding: 30px;
  position: absolute;
  text-align: center;
  top: 45%;
  transform: rotate(-90deg);
  width: 1000px;
}.contenido {
  background: #F2F2F2;
  color: #000;
  font-family: arial;
  font-size: 13px;
  height: 185px;
  margin-bottom: 2px;
  padding: 5px;overflow:hidden;
  text-align: justify;
  width: 480px;
}.contenido2 {
  background: #F2F2F2;
  color: #000;
  font-family: arial;
  font-size: 13px;
  height: 188px;
  padding: 5px;
  text-align: justify;
  width: 480px;
}
.tablonmika{
    background-color: #FDFDFD;
  border-radius: 0;
  border-top: #860000 solid 5px;
  width: 800px;position:relative;
  height:400px;
 
}.pestañas li{
display: inline-block;
margin-left: 10px;
}
.pestañas, .credito {
  display: block;background:#000;
}
.btn1, .btn2, .btn3 {
  background-color: #9C0808;
  color: #fff;border-radius: 50px;
  display: block;
  font-family: calibri;
  font-size: 10px;
  letter-spacing: 2px;
  padding: 5px;
  text-align: center;
  text-transform: uppercase;
  width: 94px;
}

/*table*/

div[class*='post--'] .postbody table,div[class*='post--'] .postbody td,#preview .postbody  table,#preview .postbody td{
   border: 0px solid #444!important;
   }

/* HEADER_MOD - begin */
#site-desc {
    text-align: center !important;
    position: sticky !important;
    margin-top: 75px !important;
}

div#site-title h1 {
   text-transform: uppercase;
    -moz-transform: scale(1);
    -webkit-transform: scale(1);
    -ms-transform: scale(1);
    transform: scale(1);
    -moz-transition: -moz-transform 0.5s ease, opacity 0.5s ease;
    -webkit-transition: -webkit-transform 0.5s ease, opacity 0.5s ease;
    -ms-transition: -ms-transform 0.5s ease, opacity 0.5s ease;
    transition: transform 0.5s ease, opacity 0.5s ease;
    display: inline-block;
    font-size: 1.75em;
    opacity: 1;
    padding: 0.35em 0em;
    position: relative;
    z-index: 1;
}

div#site-title h1:after, div#site-title h1:before {
    -moz-transition: width 0.85s ease;
    -webkit-transition: width 0.85s ease;
    -ms-transition: width 0.85s ease;
    transition: width 0.85s ease;
    -moz-transition-delay: 0.25s;
    -webkit-transition-delay: 0.25s;
    -ms-transition-delay: 0.25s;
    transition-delay: 0.25s;
    background: #fff;
    content: '';
    display: block;
    height: 2px;
    position: absolute;
    width: 100%;
}

div#site-desc > p {
    letter-spacing: 0.225em;
    text-transform: uppercase;
}

.is-sticky#headerbar-top {
    background-color: #424242 !important;
}

/* HEADER_MOD end */
/* WRAP_BODY begin */
.module .h3 {
    background-color: #424242 !important;
}
/* WRAP_BODY end */

.postprofile-avatar,
.postprofile-avatar * {
  box-sizing: border-box;
}
 
.postprofile-avatar img {
  max-width: initial;
  max-height: initial;
  height: initial;
  width: initial;
  border-radius: 0px!important;
}

.mod-login-avatar img {
   border-radius: 0px;
   border: 3px solid #FFF;
   box-shadow: 0 1px 1px rgba(0, 0, 0, 0.3), 0 0 1px rgba(0, 0, 0, 0.3);
   width: 150px;
   height: 300px;
    }

/*ranks*/
.rank {
    background: url(http://i.imgur.com/nmBh3WZ.png);
    border-radius: 3px;
    box-shadow: 1px 2px 11px rgba(0,0,0,0.29);
    color: #fff;
    font-family: 'Roboto Condensed'!important;
    font-size: 13px;
    font-weight: 400;
    height: 25px;
    line-height: 25px;
    margin: 10px auto 0;
    max-width: 120px;
    padding: 0;
    position: relative;
    text-shadow: 1px -1px rgba(0,0,0,0.29);
    text-transform: uppercase;
}
div.rank.mod {
            background-color: #37AD25!important;
            text-align:center;
 
}
.rank:before {
    border-right: 1px solid rgba(255,255,255,0.55);
    content: "NRPG";
    float: left;
    margin-top: -5px;
    padding: 5px 5px 0;
}


/*spoiler*/
.codebox
{
  background: #FCFCFC;
  border: 1px solid #E3E3E3;
  font-size: 11px;
  line-height: 170%;
  overflow: auto;
  padding: 5px;
}
.codebox dd
{
  background-color: transparent;
  margin: .3em;
  padding: .3em;
}
.codebox dt
{
  border-bottom: 0;
}
.codebox.spoiler dt
{
  background: #ECECEC url(http://i.imgur.com/psvFIEG.png) repeat-x 0 0;
  border: 1px solid #D0D0D0;
  border-radius: 2px;
  box-shadow: 0 1px 2px rgba(0,0,0,0.1), inset rgba(255,255,255,0.7) 0 1px 0;
  color: #616161;
  cursor: pointer;
  display: inline-block;
  font-size: 11px;
  height: 24px;
  line-height: 24px;
  margin: 0 0 0 5px;
  moz-border-radius: 2px;
  moz-box-shadow: 0 1px 2px rgba(0,0,0,0.1), inset rgba(255,255,255,0.7) 0 1px 0;
  padding: 0 10px;
  text-shadow: #fff 0 1px 0;
  webkit-border-radius: 2px;
  webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.1), inset rgba(255,255,255,0.7) 0 1px 0;
  white-space: nowrap;
}
.codebox.spoiler dt:hover
{
  background-color: #F8F8F8;
  color: #4C4C4C;
}
.codebox.spoiler
{
  background: transparent;
  border: 0;
}
.codebox.spoiler dd
{
  background: transparent;
}
.spoiler_content.hidden
{
  background: #FCFCFC;
  border: 1px dashed #E3E3E3;
  padding: 5px;
}
.postmain blockquote
{
  background: #FCFCFC;
  border: 1px solid #E3E3E3;
  color: #9F9F9F;
  font-size: 12px;
  margin-bottom: 5px;
  padding: 10px;
}

/*quotes*/
blockquote {
font-size: 12px;
border: 1px solid #E3E3E3;
background: #FCFCFC;
color: #9F9F9F;
margin-bottom: 5px;
}
blockquote, .postmain blockquote {padding: 10px;}
blockquote cite {
font-size: 12px;
padding: 8px 10px;
text-indent: 25px;
border: 1px solid #E3E3E3;
border-top: 0px;
border-bottom: 1px solid #E8E8E8;
background-color: #F2F2F2;
background-image: url(http://i34.servimg.com/u/f34/16/49/10/98/snapba10.png), url(http://i.imgur.com/iPXDkuF.png);
background-position: 10px center, 0 0;
background-repeat: no-repeat, repeat-x;
color: #535353;
text-shadow: rgba(255, 255, 255, 1) 0px 1px 0px;
font-weight: bold;
}
blockquote cite, .postmain cite {margin: -10px -11px 8px -11px;}

/*moderar topicos*/

#moderation_tool {margin: 0 0 8px 0;}
#moderation_tool.act_mod p {
-moz-border-radius: 3px;
-moz-box-shadow: 0 1px 0 rgba(255,255,255,1) inset, 0 1px 0 rgba(0,0,0,0.3);
-moz-transition: all .2s ease-in-out;
-webkit-border-radius: 3px;
-webkit-box-shadow: 0 1px 0 rgba(255,255,255,1) inset, 0 1px 0 rgba(0,0,0,0.3);
-webkit-transition: all .2s ease-in-out;
cursor: pointer;
webkit-touch-callout: none;
-webkit-user-select: none;
-khtml-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
background: -moz-linear-gradient(#f6f8fa,#edeeef);
background-image: -webkit-linear-gradient(#f6f8fa,#edeeef);
border: 1px solid #D9DBDD;
border-radius: 3px;
box-shadow: 0 1px 0 rgba(255,255,255,1) inset, 0 1px 0 rgba(0,0,0,0.3);
color: #616161;
display: inline-block;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#f6f8fa',endColorstr='#edeeef',GradientType=0);
font-size: 12px;
height: 22px;
line-height: 22px;
padding: 0 10px;
white-space: nowrap;
}
#popw {
background-color: #464646;
background-color: rgba(70,70,70,0.6);
padding: 4px;
-webkit-box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.7);
-moz-box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.7);
box-shadow: 0px 8px 15px rgba(0, 0, 0, 0.7 );
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
display: none;
z-index: 999;
margin-top: 16px;
position: absolute;
}
#popw .mod_hover {
background-image: url(http://i38.servimg.com/u/f38/18/24/85/15/bottom10.png);
width: 31px;
height: 16px;
top: -16px;
left: 5px;
z-index: 999;
position: absolute;
}
#popw .popwinner {
background: #fff;
max-height: 465px;
width: 190px;
overflow: auto;
-webkit-box-shadow: 0px 0px 3px rgba(0,0,0,0.4);
-moz-box-shadow: 0px 0px 3px rgba(0,0,0,0.4);
box-shadow: 0px 0px 3px rgba(0,0,0,0.4);
overflow-x: hidden;
}
#popw .popwinner li {
  background: rgb(248, 248, 248);
  list-style-type: none;
  border-bottom: 1px solid rgb(234, 234, 234);
  text-align: center;
  padding: 3px 4px;
}
#popw .popwinner li a {
  color: #333!important;
}


.Mikae3 {
  background-color: #DFECE6;
  height: 280px;
  opacity: 0.9;
  padding: 20px;
  width: 420px;
  margin-top: -18px;
}
.Mikae4 {
  height:280px;
  padding-right:2px;
  overflow:auto;
  margin-top: -5px;
  color:#35B4B6;
  font-family:arial;
  font-size:12px;
  text-align:justify;
  line-height:100%;
  letter-spacing: 1px;
}

.Mikae1 {
  background-color: #A7D4CC;
  border-bottom: 40px solid #35B4B6;
  width: 482px;
  padding: 10px;
  height: 600px;
  font: 8px Voltaire;
  color:#DFB8B5;
  letter-spacing: 3px;
  padding:6px;
}
.MikaeImage {
  width: 450px;
  height: 200px;
  border-top: 10px solid #A7D4CC;
  border-bottom: 10px solid #A7D4CC;
}
.MikaeTitu{
  background-image: url(http://i.imgur.com/VN2O2pF.png);
  font-family: arial,cursive;
  font-size: 25px;
  padding-top: 20px;
  height:60px;
  text-align:center;
  width: 600px;
  color:#DFECE6;
  text-shadow: 1px 1px 0px #ddd;
  line-height: 19px;
  position: relative;
  left: 10px;
  margin-top: 0px;
  margin-left: -65px;
}

Adicione ao CSS:

Código:

.postbody > .content div {
    box-sizing: content-box;
}

Resolveu meu problema. Obrigado.