Centralizar o rank

Qual é minha questão:
Boa tarde, membros FDF! 
Ontem à noite eu varri o fórum todo atrás de alguma ajuda que pudesse resolver meu problema. Muitos pediram a respeito, mas parece que a resposta que eles tiveram não resulta comigo.

A dúvida é a seguinte: Como centralizar o RANK? Vide como quero abaixo.


Na imagem 1 é como atualmente está. Na imagem 2, é como eu quero que fique.

Em outros tópicos sugeriam mexer na sessão de template, outros informaram código de CSS. Olhando um pouco a folha de CSS que tenho no meu fórum, encontrei uma parte que possivelmente tem alguma ligação com o rank:

/*Perfil*/
.post span.postdetails a img:first-child,.postprofile dl dt a img:first-child,.post div.user-ident div.user-basic-info a img:first-child,dl.postdetails dl a img:first-child{
.post span.postdetails a img:first-child,.postprofile dl dt a img:first-child,.post div.user-ident div.user-basic-info a img:first-child,dl.postdetails dl a img:first-child{
-moz-box-shadow:1px 1px 5px #9C9C9C;
-webkit-box-shadow:1px 1px 5px #9C9C9C;
box-shadow:1px 1px 5px #9C9C9C;
}
}

Agradeço desde já os que poderiam me ajudar.

Endereço do meu fórum:
http://ssuniverse.directorioforuns.com

Versão do fórum:
PHPBB2

Olá querida!  

Veja este tópico:  https://ajuda.forumeiros.com/t41235-

Graciosamente,
FockerH.

Olá!

Aceda à "Folha de estilo CSS":
Painel de controle ->> Visualização ->> Imagens e Cores ->> Cores / Folha de estilo CSS

Acrescente o código a seguir na folha:

Código:

.user-ident{text-align:center}

Valide!

Se não funcionar troque por este:

Código:

.user-basic-info {
text-aling: center !important;
}

Valide!

Até mais!

Olá Harker. Nenhum dos códigos resultou.
Se pode colocar o código em qualquer lugar do CSS?

Ainda está a mesma coisa.  

Olá!

Aceda á "Folha de Estilos CSS":

Painel de Controle Visualização Imagens e Cores  Cores Folha de Estilos CSS

Adicione o seguinte código no inicio da sua "Folha de Estilos CSS"

Código:

row1 .postdetails.poster-profile img:first-of-type {
margin-top: -20px;
margin-left: 20px !important;
}

Valide e veja o resultado.
Vai modificando o primeiro numero 20 para subir o rank, e, o segundo para alinhar ao centro.
Atenciosamente,
Crazy.

Não resultou também.

Olá!

Desculpe, troque por esse eu esqueci de uma coisa.

Código:

        .row1 .postdetails.poster-profile img:first-of-type {
        margin-top: -20px;
        margin-left: 20px !important;
        }

Até mais.

Crazy, testei aqui e modificou, mas não o rank e sim o avatar. Modificando o "margin-left", o avatar ia se afastando da esquerda conforme aumentava. E o outro "margin-top" afastava ele do rank e da ficha de personagem. :'(

O rank em si não teve modificações, ele continua no mesmo lugar.

Olá querida!

Tente este código CSS:

Código:

.postdetails.poster-profile {
text-align: center !Important;
position: relative;
}

Se ele não resultar, peço que me mande teu CSS completo por gentileza.

Até mais.

Olá Mikéé.

Também não resultou. Será que tem algo no código que impede? De qualquer forma, como solicitado por você, segue abaixo a folha inteira de CSS:

Código:

body

#i_logo {
height: 840px !important;
width: 1290px !important;
}
 
#page-body
{
width: 900px;
margin: auto;
background: url(http://nsae01.casimages.net/img/2013/06/15/130615010928759941.png) top center no-repeat #000000;
border-radius: 100px;
  border: 2px solid #A2916C;
-moz-border-radius: 100px;
-o-border-radius: 100px;
-webkit-border-radius: 100px;
-htm-border-radius: 100px;
box-shadow: 0px 0px 10px #515151;
-moz-box-shadow: 0px 0px 10px #515151;
-o-box-shadow: 0px 0px 10px #515151;
-webkit-box-shadow: 0px 0px 10px #515151;
-htm-box-shadow: 0px 0px 10px #515151;
padding-top: 250px;
padding-bottom: 20px;
}
#navigation
{
float: right;
margin-top: -200px;
margin-right: 20px;
}
.mainmenu
{
margin-right: 2px;
}
a.mainmenu
{
opacity: 0.5;
-moz-opacity: 0.5;
-khtml-opacity: 0.5;
filter: alpha(opacity=50);
}
a.mainmenu:hover
{
opacity: 1;
-moz-opacity: 1;
-khtml-opacity: 1;
filter: alpha(opacity=100);
}

.table_complete
{
width: 850px;
margin-left: auto;
margin-right: auto;
margin-bottom: 10px;
margin-top: 10px;
border-radius: 10px;
  border: 2px solid #A2916C;
-moz-border-radius: 10px;
-o-border-radius: 10px;
-webkit-border-radius: 10px;
-htm-border-radius: 10px;
box-shadow: 0px 0px 4px #515151;
-moz-box-shadow: 0px 0px 4px #515151;
-o-box-shadow: 0px 0px 4px #515151;
-webkit-box-shadow: 0px 0px 4px #515151;
-htm-box-shadow: 0px 0px 4px #515151;
}
.forumline
{
max-width: 850px;
margin-left: auto;
margin-right: auto;
margin-bottom: 10px;
margin-top: 10px;
  border: 2px solid #2e2e2e;
border-radius: 10px;
-moz-border-radius: 10px;
-o-border-radius: 10px;
-webkit-border-radius: 10px;
-htm-border-radius: 10px;
box-shadow: 0px 0px 4px #515151;
-moz-box-shadow: 0px 0px 4px #515151;
-o-box-shadow: 0px 0px 4px #515151;
-webkit-box-shadow: 0px 0px 4px #515151;
-htm-box-shadow: 0px 0px 4px #515151;
background: url(http://nsae01.casimages.net/img/2013/06/15/130615021829328300.png) bottom center no-repeat #000000;
}
.forumline2
{
max-width: 850px;
margin: auto;
background: url(http://nsae01.casimages.net/img/2013/06/15/130615021829328300.png) bottom center no-repeat #000000;
}
.table_head
{
width: 850px;
height: 92px;
margin: auto;
background: url(http://img11.hostingpics.net/pics/469045forumline01.jpg) top center no-repeat;
}
.table_foot
{
width: 850px;
height: 42px;
margin: auto;
background: url(http://img11.hostingpics.net/pics/835984forumline04.jpg) top center no-repeat;
}
.secondarytitle
{
display: block;
text-align: center;
}
.titre_cate
{
font-size: 48px;
font-weight: bold;
  color: #c0c0c0;
text-shadow: 1px 1px 0px #000000;
}

.forumlink
{
display: block;
width: 80%;
margin-top: 6px;
}
.forumlink a
{
font-size: 14px;
text-transform: uppercase;
border-bottom: 2px dotted #000000;
color: #5a463a !important;
}
.forumlink a:hover
{
text-decoration: none !important;
color: #BF0000 !important;
border-bottom: 2px dotted #2d1500;
}
.table_cate
{
vertical-align: top;
}
.icone
{
display: block;
width: 100px;
height: 100px;
float: left;
}
.stats_last
{
display: block;
width: 150px;
margin-left: 60px;
margin-top: 20px;
padding: 4px;
background-color: #bebebe;
border: 2px solid #676767;
border-radius: 5px;
-moz-border-radius: 5px;
-o-border-radius: 5px;
-webkit-border-radius: 5px;
-htm-border-radius: 5px;
text-align: center;
}
.stats
{
display: block;
font-size: 10px;
font-weight: bold;
border-bottom: 1px dotted #2d1500;
padding-bottom: 2px;
margin-bottom: 4px;
}
.last
{
display: block;
font-size: 11px;
}
.cate_contenu
{
width: 600px;
margin-left: 10px;
}
.description_cate
{
border-left: 4px solid #bebebe;
border-right: 4px solid #bebebe;
height: 100px;
overflow: auto;
padding: 5px;
}
.illu_cate
{
float: left;
margin-right: 5px;
margin-bottom: 5px;
border-radius: 100px;
-moz-border-radius: 100px;
-o-border-radius: 100px;
-webkit-border-radius: 100px;
-htm-border-radius: 100px;
border: 3px solid #e8dc4c;
}
.description
{
display: block;
text-align: justify;
}
.qeel
{
width: 850px;
margin: auto;
height: 400px;
background: url(http://img11.hostingpics.net/pics/945551fondqeel.jpg) center center no-repeat;
}
.stats1
{
width: 400px;
background-color: #bebebe;
border: 2px solid #676767;
border-radius: 5px;
-moz-border-radius: 5px;
-o-border-radius: 5px;
-webkit-border-radius: 5px;
-htm-border-radius: 5px;
text-align: center;
padding: 6px;
}
.stats2
{
width: 250px;
max-height: 200px;
overflow: auto;
margin-top: 20px;
background-color: #bebebe;
border: 2px solid #676767;
border-radius: 5px;
-moz-border-radius: 5px;
-o-border-radius: 5px;
-webkit-border-radius: 5px;
-htm-border-radius: 5px;
text-align: center;
padding: 6px;
}
.groupes
{
width: 150px;
float: right;
max-height: 250px;
overflow: auto;
text-align: center;
padding: 6px;
margin-top: 70px;
background-color: #bebebe;
border: 2px solid #676767;
border-radius: 5px;
-moz-border-radius: 5px;
-o-border-radius: 5px;
-webkit-border-radius: 5px;
-htm-border-radius: 5px;
}
.groupes a
{
display: block;
padding: 3px;
margin-bottom: 5px;
background-color: #eeeeee;
text-decoration: none !important;
border-radius: 10px;
-moz-border-radius: 10px;
-o-border-radius: 10px;
-webkit-border-radius: 10px;
-htm-border-radius: 10px;
border-left: 3px solid #676767;
border-right: 3px solid #676767;
}
.groupes a:hover
{
border-left: 3px solid #e26b0a;
border-right: 3px solid #e26b0a;
}
.cb
{
margin-top: 50px;
}

        .topiclist.forums dd.lastpost{background:#fff;border:1px solid #DDD;border-radius:3px 0 0 3px;border-right:none;height:45px;width:204px;padding-left:10px!important}

        .tipsy {
        padding: 5px;
        font-size: 11px;
        position: absolute;
        text-shadow: none;
        z-index: 999;
        }

        .tipsy-inner {
        padding: 8px 8px 8px 8px;
        background-color: black;
        color: white;
        max-width: 200px;
        text-align: center;
        -webkit-box-shadow: 0 1px 3px rgba(0,0,0, .4);
        -moz-box-shadow: 0 1px 3px rgba(0,0,0, .4);
        background: black url(http://cuul.tk/img/gradient.png) repeat-x 0 -150px;
        }

        .tipsy-inner {
        border-radius: 3px;
        -moz-border-radius:3px;
        -webkit-border-radius:3px;
        }

        .tipsy-arrow {
        position: absolute;
        background: url('http://cuul.tk/img/tipsy.gif') no-repeat top left;
        width: 9px;
        height: 5px;
        }

        .tipsy-n .tipsy-arrow {
        top: 0;
        left: 50%;
        margin-left: -4px;
        }

        .tipsy-nw .tipsy-arrow {
        top: 0;
        left: 10px;
        }

        .tipsy-ne .tipsy-arrow {
        top: 0;
        right: 10px;
        }

        .tipsy-s .tipsy-arrow {
        bottom: 0;
        left: 50%;
        margin-left: -4px;
        background-position: bottom left;
        }

        .tipsy-sw .tipsy-arrow {
        bottom: 0;
        left: 10px;
        background-position: bottom left;
        }

        .tipsy-se .tipsy-arrow {
        bottom: 0;
        right: 10px;
        background-position: bottom left;
        }

        .tipsy-e .tipsy-arrow {
        top: 50%;
        margin-top: -4px;
        right: 0;
        width: 5px;
        height: 9px;
        background-position: top right;
        }

        .tipsy-w .tipsy-arrow {
        top: 50%;
        margin-top: -4px;
        left: 0;
        width: 5px;
        height: 9px;
        }

        .post .name {
        display: block;
        float: center;
        magin: auto;
        padding: 4px;
        text-align: center;
        font-size: 12px;
        margin-top: 10px;
        background: url(http://i73.servimg.com/u/f73/17/93/12/26/50050613.png) no-repeat top center;
        height: 25px;
        min-width: 129px;
        }

        .name,.postdetails{margin-left:0px;text-align:center;}
        .postdetails img{margin-left: 0px;text-align:center;}

        .post td.row2[width="150"], .post td.row1[width="150"] {
        border: 1px solid #570300;
        border-radius: 10px;
        }
 
/*Tooltip*/
        div.infobulle_avatar em {
        display:none;
        }

        div.infobulle_avatar:hover {
        background: none;
        z-index: 999;
        cursor: hand;
        position: relative;
        text-decoration:none;
        border: 0;
        }

        div.infobulle_avatar:hover em {
        font-style: normal;
        font-size: 10px;
        color:#000 !important;
        padding: 8px;
        display: block;
        position: absolute;
        -moz-border-radius: 5px;
        -webkit-border-radius: 5px;
        border-radius: 5px ;
        background-color: #FFF;
        width:800px;
        top: 100px;
        left: 150px;
  border: 2px solid #000000;
-moz-border-radius: 100px;
-o-border-radius: 100px;
-webkit-border-radius: 100px;
-htm-border-radius: 100px;
box-shadow: 0px 0px 10px #515151;
-moz-box-shadow: 0px 0px 10px #515151;
-o-box-shadow: 0px 0px 10px #515151;
-webkit-box-shadow: 0px 0px 10px #515151;
-htm-box-shadow: 0px 0px 10px #515151;
        }

div.postprofile dl dd {
  text-align:center
}

/*Cores*/
        .colorpicker {
                          width: 356px;
                          height: 176px;
                          overflow: hidden;
                          position: absolute;
                          background: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp11.png);
                          font-family: Arial, Helvetica, sans-serif;
                          display: none;
                        }
                        .colorpicker_color {
                          width: 150px;
                          height: 150px;
                          left: 14px;
                          top: 13px;
                          position: absolute;
                          background: #f00;
                          overflow: hidden;
                          cursor: crosshair;
                        }
                        .colorpicker_color div {
                          position: absolute;
                          top: 0;
                          left: 0;
                          width: 150px;
                          height: 150px;
                          background: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp12.png);
                        }
                        .colorpicker_color div div {
                          position: absolute;
                          top: 0;
                          left: 0;
                          width: 11px;
                          height: 11px;
                          overflow: hidden;
                          background: url(http://i46.servimg.com/u/f46/16/56/73/62/select10.gif);
                          margin: -5px 0 0 -5px;
                        }
                        .colorpicker_hue {
                          position: absolute;
                          top: 13px;
                          left: 171px;
                          width: 35px;
                          height: 150px;
                          cursor: n-resize;
                        }
                        .colorpicker_hue div {
                          position: absolute;
                          width: 35px;
                          height: 9px;
                          overflow: hidden;
                          background: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp10.gif) left top;
                          margin: -4px 0 0 0;
                          left: 0px;
                        }
                        .colorpicker_new_color {
                          position: absolute;
                          width: 60px;
                          height: 30px;
                          left: 213px;
                          top: 13px;
                          background: #f00;
                        }
                        .colorpicker_current_color {
                          position: absolute;
                          width: 60px;
                          height: 30px;
                          left: 283px;
                          top: 13px;
                          background: #f00;
                        }
                        .colorpicker input {
                          background-color: transparent;
                          border: 1px solid transparent;
                          position: absolute;
                          font-size: 10px;
                          font-family: Arial, Helvetica, sans-serif;
                          color: #898989;
                          top: 4px;
                          right: 11px;
                          text-align: right;
                          margin: 0;
                          padding: 0;
                          height: 11px;
                        }
                        .colorpicker_hex {
                          position: absolute;
                          width: 72px;
                          height: 22px;
                          background: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp13.png) top;
                          left: 212px;
                          top: 142px;
                        }
                        .colorpicker_hex input {
                          right: 6px;
                        }
                        .colorpicker_field {
                          height: 22px;
                          width: 62px;
                          background-position: top;
                          position: absolute;
                        }
                        .colorpicker_field span {
                          position: absolute;
                          width: 12px;
                          height: 22px;
                          overflow: hidden;
                          top: 0;
                          right: 0;
                          cursor: n-resize;
                        }
                        .colorpicker_rgb_r {
                          background-image: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp14.png);
                          top: 52px;
                          left: 212px;
                        }
                        .colorpicker_rgb_g {
                          background-image: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp15.png);
                          top: 82px;
                          left: 212px;
                        }
                        .colorpicker_rgb_b {
                          background-image: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp16.png);
                          top: 112px;
                          left: 212px;
                        }
                        .colorpicker_hsb_h {
                          background-image: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp17.png);
                          top: 52px;
                          left: 282px;
                        }
                        .colorpicker_hsb_s {
                          background-image: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp18.png);
                          top: 82px;
                          left: 282px;
                        }
                        .colorpicker_hsb_b {
                          background-image: url(http://i46.servimg.com/u/f46/16/56/73/62/colorp19.png);
                          top: 112px;
                          left: 282px;
                        }
                        .colorpicker_submit {
                          position: absolute;
                          width: 22px;
                          height: 22px;
                          background: url(http://i46.servimg.com/u/f46/16/56/73/62/aceita10.png) top;
                          left: 322px;
                          top: 142px;
                          overflow: hidden;
                        }
                        .colorpicker_focus {
                          background-position: center;
                        }
                        .colorpicker_hex.colorpicker_focus {
                          background-position: bottom;
                        }
                        .colorpicker_submit.colorpicker_focus {
                          background-position: bottom;
                        }
                        .colorpicker_slider {
                          background-position: bottom;
                        }


/*Perfil*/
.post span.postdetails a img:first-child,.postprofile dl dt a img:first-child,.post div.user-ident div.user-basic-info a img:first-child,dl.postdetails dl a img:first-child{
.post span.postdetails a img:first-child,.postprofile dl dt a img:first-child,.post div.user-ident div.user-basic-info a img:first-child,dl.postdetails dl a img:first-child{
-moz-box-shadow:1px 1px 5px #9C9C9C;
-webkit-box-shadow:1px 1px 5px #9C9C9C;
box-shadow:1px 1px 5px #9C9C9C;
}
}


/*QUOTE, SPOILER*/
.quote {
border: 2px solid #e8dc4c;
-moz-border-radius: 100px;
-o-border-radius: 100px;
-webkit-border-radius: 100px;
-htm-border-radius: 100px;
box-shadow: 0px 0px 10px #515151;
-moz-box-shadow: 0px 0px 10px #515151;
-o-box-shadow: 0px 0px 10px #515151;
-webkit-box-shadow: 0px 0px 10px #515151;
-htm-box-shadow: 0px 0px 10px #515151;
}

.spoiler_content { border: 2px solid #e8dc4c;
-moz-border-radius: 100px;
-o-border-radius: 100px;
-webkit-border-radius: 100px;
-htm-border-radius: 100px;
box-shadow: 0px 0px 10px #515151;
-moz-box-shadow: 0px 0px 10px #515151;
-o-box-shadow: 0px 0px 10px #515151;
-webkit-box-shadow: 0px 0px 10px #515151;
-htm-box-shadow: 0px 0px 10px #515151; }

.spoiler_closed { border: 2px solid #e8884c;
-moz-border-radius: 100px;
-o-border-radius: 100px;
-webkit-border-radius: 100px;
-htm-border-radius: 100px;
box-shadow: 0px 0px 10px #515151;
-moz-box-shadow: 0px 0px 10px #515151;
-o-box-shadow: 0px 0px 10px #515151;
-webkit-box-shadow: 0px 0px 10px #515151;
-htm-box-shadow: 0px 0px 10px #515151; }

/*Botões*/
        input.button1, input.button2, button.button2, #main-content a.cgu-buttons {
        background: #f4f5f4 url(http://i66.servimg.com/u/f66/11/96/49/61/tabbg10.png);
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        border-radius: 3px;
        padding: 2px;
        border: solid 1px #DDDDDD;
        }

td.catHead, th.thHead, td.cat, td.catBottom, td.catHead, td.cat, td.catBottom, td.catHead, td.catLeft, td.catRight, td.catSides, td.cat, td.catLeft, th.thLeft, td.thCornerL {
border: none;
}
td.catLeft, th.thLeft

                          .postprofile { padding-top: 5px; border: 1px solid #B1D5EE; background-color: #E1EBF2; display: block; text-align: center; -webkit-border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px; -moz-border-radius: 5px; border-left-radius: 5px; border-top-radius: 5px; }

        .name {margin-left: 15%;}
        .post td.row2[width="150"], .post td.row1[width="150"] {width: 23%;}
        .infobulle_avatar {text-align: center;}


Olá!

Procure por:

Código:

  .name,.postdetails{margin-left:0px;text-align:center;}
        .postdetails img{margin-left: 0px;text-align:center;}

Troque por:

Código:

  .name,.postdetails{margin-left:0px;text-align:center;}
        .postdetails img{margin-left: 4px;text-align:center;}

Vai auimentando o 4px.

Até mais.

Crazy, não resultou. Aconteceu a mesma coisa que ocorreu anteriormente. O avatar é arrastado pra direita, só que desta vez, arrastou a ficha junto. Olhe só:



O rank continuou intacto na esquerda.

Olá!


Aceda à "viewtopic_body":
Painel de Controle Visualização Templates Geral viewtopic_body

Procure por

Código:

{postrow.displayed.POSTER_RANK}<br />
 {postrow.displayed.RANK_IMAGE}{postrow.displayed.POSTER_AVATAR}

Troque por

Código:


<div class="rank_img">{postrow.displayed.POSTER_RANK}<br />
                                  {postrow.displayed.RANK_IMAGE}</div>

Salve & Publique.

Aceda à "Folha de Estilos CSS":
Painel de Controle Visualização Imagens & Cores Cores Folha de Estilo CSS

Código:

Código:

.rank_img {
text-align:center;
margin-left: 2px;
}

Valide!

Até mais.

Crazy, resultou e centralizou, porém o avatar sumiu! AAAA.  

Veja só. Modifiquei o template como havia pedido. Ficou desta forma:


Salvei e registrei. Em seguida inclui o código que você disse no início da folha de css e validei. Quando fui verificar o resultado, ficou assim:


Ai meu Deus!  

Olá!

No primeiro procedimento faça deste modo:
Procure por:

Código:

        {postrow.displayed.POSTER_RANK}<br />
        {postrow.displayed.RANK_IMAGE}{postrow.displayed.POSTER_AVATAR}

Troque por:

Código:


        <div class="rank_img">{postrow.displayed.POSTER_RANK}<br />
        {postrow.displayed.RANK_IMAGE}</div>{postrow.displayed.POSTER_AVATAR}

Mantenha o CSS adicionado anteriormente.
Antes de fazer os passos acima, delete o template e faça tudo do inicio.

Até mais.

Substitua o template passado por esse:

Código:

<div class="rank_img">{postrow.displayed.POSTER_RANK}<br />
{postrow.displayed.POSTER_AVATAR}                                {postrow.displayed.RANK_IMAGE}</div>

Salve & Publique

Resulta?

Oba!  
Problema resolvido, finalmente.

Obrigada aos que ajudaram. Fechando o tópico! \o