MyBB Community Forums

i have two group images. i want to change the position of group image. i have edited the post template as below.

<div class="author_information">
			<strong><span class="largetext">{$post['profilelink']}</span></strong><br />
			<span class="smalltext">
				{$post['usertitle']}<br />
				{$post['userstars']}
				
			</span>
	</div>
<!-- edited part-->
	<div style="text-align: center;">{$post['groupimage']} {$post['additional_images']}</div>

	<div class="author_statistics">
		{$post['user_details']}
		<br/>
		{$post['onlinestatus']}
	</div>

but it shows like this.  it shows with extra space.



but i want to display like this



or



how to edit the code?

is there a way to overcome this ?

Please provide your website URL so we can assist you further.

It's easy to do with CSS but I can't solve it just by looking at an image.

Agree with @BritishKitten Provide your forum URL to better assist you. Also did you tried Position: absolute; ?

Try this:

<div class="author_information" style="display: inline-block;">
            <strong><span class="largetext">{$post['profilelink']}</span></strong><br />
            <span class="smalltext">
                {$post['usertitle']}<br />
                {$post['userstars']}
                
            </span>
    </div>
<!-- edited part-->
    <div style="text-align: center; display: inline-block;">{$post['groupimage']} {$post['additional_images']}</div>

    <div class="author_statistics" style="display: inline-block;">
        {$post['user_details']}
        <br/>
        {$post['onlinestatus']}
    </div>

If that doesn't work try this:

<table width="100%" cellpadding="0" cellspacing="0">
<tr>
<td width="33.3%" valign="middle">
<div class="author_information" style="display: inline-block;">
            <strong><span class="largetext">{$post['profilelink']}</span></strong><br />
            <span class="smalltext">
                {$post['usertitle']}<br />
                {$post['userstars']}
                
            </span>
    </div>
</td>
<td width="33.3%" valign="middle">
<!-- edited part-->
    <div style="text-align: center; display: inline-block;">{$post['groupimage']} {$post['additional_images']}</div>
</td>
<td width="33.3%" valign="middle">
    <div class="author_statistics" style="display: inline-block;">
        {$post['user_details']}
        <br/>
        {$post['onlinestatus']}
    </div>
</td>
</table>

^ If using the table, and it turns out to look weird go to global.css of the current theme and find this and remove it.

table {
	color: #333;
	font-size: 13px;
}

thank you isoldehn and Dark-Power-Invader for your guidance. with your help problem solved. and BritishKitten thank you for your reply.

code is this. and it came to center without extra spaces.

<div style="text-align: center;position: absolute;display: inline-block;left: 45%;">{$post['groupimage']}{$post['additional_images']}</div>