[Forum] How to center the postbit info - 4.2

[joeychgo]

I want to center the postbit legacy Username, user title, rank badge and avatar ... How to do this?

[Merjawy]

Try this, I am sure there's a better way

in postbit_legacy fine

 </div>
 <div class="postdetails"> 

Change it to

 </div>
 <center><div class="postdetails"> 

Then in same template, find

     <dd id="reppower_{vb:raw post.postid}_{vb:raw post.userid}">{vb:raw post.reppower}</dd> 
      </vb:if>
     </vb:if>
    </dl>
    </vb:if> 

Change it to

     <dd id="reppower_{vb:raw post.postid}_{vb:raw post.userid}">{vb:raw post.reppower}</dd> 
      </vb:if>
     </vb:if>
    </dl>
    </vb:if></center> 

[joeychgo]

Thanks - ill try

- - - Updated - - -

Got most of it but not the avatar

[Lynne]

Do this for the avatar:

[COLOR=#000000][FONT=Monaco].postbitlegacy .userinfo .postuseravatar, 
[/FONT][/COLOR][COLOR=#000000][FONT=Monaco]  [COLOR=#006400]float[/COLOR]:[COLOR=#00008B]none[/COLOR];
  [COLOR=#006400]text-align[/COLOR]:[COLOR=#00008B]center[/COLOR];
  

[/FONT][/COLOR]
[COLOR=#000000][FONT=Monaco]}[/FONT][/COLOR]

[joeychgo]

where ? additional css?

[Merjawy]

There are few places in postbit.css you can play with and see...

- - - Updated - - -

I cheated I found this posted by Lynne a while back.

Try adding this to additional.css (may have to modify for 4.0.1):

/* center avatar, username, title, rank in postbit legacy 4.0.2 */
.postbitlegacy .userinfo .username_container, .postbitlegacy .userinfo .rank, .postbitlegacy .userinfo .usertitle {text-align:center;}
.postbitlegacy .userinfo .postuseravatar, .postbitlegacy .userinfo .postuseravatar img {float:none; text-align:center;}

- - - Updated - - -

[riskreward]

There are few places in postbit.css you can play with and see...

- - - Updated - - -

I cheated I found this posted by Lynne a while back.



- - - Updated - - -

[ATTACH=CONFIG]61095[/ATTACH]

Works like a charm. Need to know how to center "Join Date, Posts etc"

[John Lester]

Try this (in additional.css), I can't say for certain this works as I only tested it here with Firebug and without the rest of the info being centered it looks a bit odd

.postbit .userinfo .contact, .userinfo .userinfo_extra, .postbit .userinfo_noavatar .contact {
    display: inline-block;
    height: auto !important;
    text-align: center !important;
}