PDA

View Full Version : How to make avatar central in postbit?


BrightStar
03-21-2012, 01:00 PM
Hiya

How can I make this avatar appear central as per other elements? Do I mess in postbit template or have to do somewhere else?

http://www.thyroidhelp.org/pic.JPG

Thanks

--------------- Added 1332334864 at 1332334864 ---------------

<vb:if condition="$show['avatar']">
<div class="usercenter">
<a class="postuseravatar" href="{vb:link member, {vb:raw post}}" title="{vb:rawphrase {vb:raw post['onlinestatusphrase']}, {vb:raw post.username}}">
<img src="{vb:raw post.avatarurl}" alt="{vb:rawphrase xs_avatar, {vb:raw post.username}}" title="{vb:rawphrase xs_avatar, {vb:raw post.username}}" />
</a>
</div>

The above is the code from the postbit template.

BrightStar
03-22-2012, 09:06 PM
Anyone??? :confused:

ssdevious
03-22-2012, 11:55 PM
Hey there,

this is postbit_legacy, what you're showing, it has its own template though, just to make it clear.

You simply throw <center> tags in there, that worked for me. If that fails, simply go for "div" and "align: center" - that would definitely work.

For those <center> ones, try to wrap it around the <a href> tag.

If all that fails, PM me, I will check with my own postbit_legacy.

Regards,
~tEh'Pâr4d0x

BrightStar
03-23-2012, 09:20 AM
Thanks a lot ssdevious.

So which template should I editing for this avatar location? I've tried adding

<div class="usercenter align="center"> doesn't seem to work.

HawkeBoE
03-23-2012, 12:32 PM
why not try to edit the css file for this?

Edit the postbit.css and type in a new line:

.postuseravatar img {
margin-left: 50px;
}
or an other value that fits
margin-left: auto; margin-right: auto; isn't working, don't know why

I don't know much about this (html, css and php coding), but for me it seems to be the easiest way.

ssdevious
03-23-2012, 01:03 PM
Hi,

I was using this, to center the ranks:

<div class="rank" style="text-align:center;">{vb:raw post.rank}</div>

You could try to apply the same onto your avatar, it should work.

Else, read this topic: https://vborg.vbsupport.ru/showthread.php?t=279869

It might help you to get understand, how this works.

What I learned from that is that you must follow the blocks, because very often, it inherits style (floating, align, etc.) from some "master" parameter above it.

Hope this helps a bit, if you want to play with it on your own. If not, try to PM Lynne or Iain, those guys are really amazing at helping people.

Wish you fixing this soon,
~tEh'P?r4d0x

Iain M
03-23-2012, 02:10 PM
Aww thanks SSDevious :p

I'll have a look and see if I can figure it out.

EDIT:
If you remove the class from
<a class="postuseravatar" href="{vb:link member, {vb:raw post}}" title="{vb:rawphrase {vb:raw post['onlinestatusphrase']}, {vb:raw post.username}}">
<img src="{vb:raw post.avatarurl}" alt="{vb:rawphrase xs_avatar, {vb:raw post.username}}" title="{vb:rawphrase xs_avatar, {vb:raw post.username}}" />
</a>
so it becomes
<a href="{vb:link member, {vb:raw post}}" title="{vb:rawphrase {vb:raw post['onlinestatusphrase']}, {vb:raw post.username}}">
<img src="{vb:raw post.avatarurl}" alt="{vb:rawphrase xs_avatar, {vb:raw post.username}}" title="{vb:rawphrase xs_avatar, {vb:raw post.username}}" />
</a>
that should center it.

If not, send me a link to your forum =]

BrightStar
03-23-2012, 06:43 PM
Thanks a lot guys. Very much appreciate the time you guys take to resolve other people's issue.

Awesome.....it works :D:D

Thank you so much, :up: