How to make avatar central in postbit?

[BrightStar]

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?



Thanks

--------------- Added [DATE]1332334864[/DATE] at [TIME]1332334864[/TIME] ---------------

<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]

Anyone???

[ssdevious]

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]

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]

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]

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]

Aww thanks SSDevious

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]

Thanks a lot guys. Very much appreciate the time you guys take to resolve other people's issue.

Awesome.....it works

Thank you so much, :up: