For those having issues with the white arrow appearing on the left instead of the right, use the following in your postbit or postbit_legacy:
HTML Code:
{vb:raw template_hook.postbit_start}
<li class="postbitlegacy postbitim postcontainer {vb:raw post.statusicon}" id="post_{vb:raw post.postid}">
<a name="post{vb:raw post.postid}"></a>
<!-- see bottom of postbit.css for .userinfo .popupmenu styles -->
<div class="postdetails">
<div class="userinfo" style="text-align: center;padding-bottom: 35px;">
<div style=" position: absolute; top: 5px; left: 5px; ">
<vb:if condition="$show['inlinemod']">
<label for="post_imod_checkbox_{vb:raw post.postid}"><input class="postimod" type="checkbox" id="post_imod_checkbox_{vb:raw post.postid}" name="plist[{vb:raw post.postid}]" value="{vb:raw post.checkbox_value}"></label>
</vb:if>
</div>
<vb:if condition="THIS_SCRIPT == 'showthread' || THIS_SCRIPT == 'private'">
{vb:raw post.onlinestatus}
<vb:else />
<a class="postuseravatar" href="{vb:link member, {vb:raw post}}" style="margin: auto; height: auto; border: grey 1px solid; display: inline-block;padding: 1px;box-shadow: 0px 0px 10px grey;">
</vb:if>
<img src="<vb:if condition="$show['avatar']">{vb:raw post.avatarurl}<vb:else />/default_avatar_medium.png</vb:if>" alt="" style=" max-height: 64px; max-width: 64px !important; background: #fff;" />
</a>
<div>
<div class="username_container" style=" margin-bottom: 0px; margin-top: 10px; ">
<vb:if condition="$post['userid']">
{vb:raw memberaction_dropdown}
<vb:else />
<span class="username guest">{vb:raw post.musername}</span>
</vb:if>
</div>
<span class="usertitle">
{vb:raw post.usertitle}
</span>
<vb:if condition="$post['rank']">
<span class="rank">{vb:raw post.rank}</span>
</vb:if>
{vb:raw template_hook.postbit_userinfo_left}
<vb:if condition="$show['reputation']">
<span class="postbit_reputation" id="repdisplay_{vb:raw post.postid}_{vb:raw post.userid}" title="{vb:raw post.username} {vb:raw post.level}">
<vb:each from="reputationdisplay" value="row">
<img class="{vb:raw row.class}" src="{vb:stylevar imgdir_reputation}/reputation_{vb:raw row.posneg}{vb:raw row.imgext}" alt="" />{vb:raw row.rowend}
</vb:each>
</span>
</vb:if>
<vb:if condition="$post['userid']">
<div style=" margin-top: 15px; font-size: 11px; ">
<vb:if condition="$post['joindate']">{vb:rawphrase join_date}: {vb:raw post.joindate}<br /></vb:if>
<vb:if condition="$post['field2']">{vb:rawphrase location_perm}: {vb:raw post.field2}<br /></vb:if>
<vb:if condition="$post['age']">{vb:rawphrase age}: {vb:raw post.age}<br /></vb:if>
{vb:rawphrase posts}: {vb:raw post.posts}<br />
{vb:raw template_hook.postbit_userinfo_right_after_posts}
<vb:if condition="$show['infraction'] OR $show['reppower']">
<vb:if condition="$show['infraction']">
{vb:rawphrase infractions}: {vb:raw post.warnings}/{vb:raw post.infractions} ({vb:raw post.ipoints})<br />
</vb:if>
<vb:if condition="$show['reputation']">
<vb:if condition="$show['reppower']">
{vb:rawphrase reppower}: {vb:raw post.reppower}
</vb:if>
</vb:if>
</div>
</vb:if>
{vb:raw template_hook.postbit_userinfo_right}
</vb:if>
</div></div></div>
<div class="postbody" style="background: #fff;">
<div style=" border-left-color: hsl(200, 6%, 80%); border-top-color: hsl(200, 6%, 80%); border-bottom-color: hsl(200, 6%, 80%); top: 34px; border-left: 13px solid hsl(200, 6%, 80%); border-top: 7px solid transparent; border-bottom: 7px solid transparent; right: -13px; position: absolute; background: transparent; height: 0; width: 0; "></div>
<div style=" border-left-color: white; border-top-color: hsl(200, 6%, 80%); border-bottom-color: hsl(200, 6%, 80%); top: 35px; border-left: 10px solid white; border-top: 6px solid transparent; border-bottom: 6px solid transparent; right: -10px; position: absolute; background: transparent; height: 0; width: 0; "></div>
<div style=" padding-bottom: 61px; clear: none; padding-top: 5px; padding-left: 15px; padding-left: 15px; position: relative; ">
<vb:if condition="$post['title'] OR $show['messageicon']">
<h2 style=" width: 95%; float: left; font-size: 16px; line-height: 16px; font-weight: bold; ">
{vb:raw post.title}
</h2>
</vb:if>
<div style="float: left; text-align: left; font-size: 12px;font-size: 11px !important; color: hsl(0, 0%, 42%) !important;">#{vb:raw post.postcount}</div>
<div class="post-date" style="line-height: 20px; float: left; width: 95%;font-size: 11px !important; color: hsl(0, 0%, 42%) !important;">
<vb:if condition="$show['announcement']">
{vb:rawphrase x_until_y, {vb:raw post.startdate}, {vb:raw post.enddate}}
<vb:else />
{vb:raw post.postdate}<vb:if condition="!$show['detailedtime']">, {vb:raw post.posttime}</vb:if>
</vb:if>
</div>
<div style=" float: left; padding: 15px 0; overflow: auto; line-height: 16px; width: 100%; color: hsl(198, 12%, 16%); ">
<div class="postrow<vb:if condition="$show['postedited'] || $post['signature']"> has_after_content</vb:if>" style=" padding: 0 0 0 0px; ">
{vb:raw template_hook.postbit_messagearea_start}
<vb:if condition="$post['isfirstshown']">
{vb:raw ad_location.ad_showthread_firstpost_start}
{vb:raw ad_location.thread_first_post_content}
</vb:if>
<vb:if condition="$post['islastshown']">
{vb:raw ad_location.thread_last_post_content}
</vb:if>
<div class="content<vb:if condition="$show['first_ad'] OR $show['last_ad']"> hasad</vb:if>">
<div id="post_message_{vb:raw post.postid}" style="padding-bottom: 20px;">
<blockquote class="postcontent restore ">
{vb:raw post.message}
</blockquote>
</div>
<vb:if condition="$show['attachments']">
<div class="attachments">
<vb:if condition="$show['thumbnailattachment']">
<fieldset class="postcontent">
<legend><img src="{vb:stylevar imgdir_misc}/paperclip.png" class="inlineimg" alt="{vb:rawphrase attached_thumbnails}" /> {vb:rawphrase attached_thumbnails}</legend>
{vb:raw post.thumbnailattachments}
</fieldset>
</vb:if>
<vb:if condition="$show['imageattachment']">
<fieldset class="postcontent">
<legend><img src="{vb:stylevar imgdir_misc}/paperclip.png" class="inlineimg" alt="{vb:rawphrase attached_images}" /> {vb:rawphrase attached_images}</legend>
{vb:raw post.imageattachments}
</fieldset>
</vb:if>
<vb:if condition="$show['imageattachmentlink']">
<fieldset class="postcontent">
<legend><img src="{vb:stylevar imgdir_misc}/paperclip.png" class="inlineimg" alt="{vb:rawphrase attached_images}" /> {vb:rawphrase attached_images}</legend>
<ul>
{vb:raw post.imageattachmentlinks}
</ul>
</fieldset>
</vb:if>
<vb:if condition="$show['otherattachment']">
<fieldset class="postcontent">
<legend><img src="{vb:stylevar imgdir_misc}/paperclip.png" class="inlineimg" alt="{vb:rawphrase attached_files}" /> {vb:rawphrase attached_files}</legend>
<ul>
{vb:raw post.otherattachments}
</ul>
</fieldset>
</vb:if>
<vb:if condition="$show['moderatedattachment']">
<fieldset class="postcontent">
<legend><img src="{vb:stylevar imgdir_misc}/paperclip.png" class="inlineimg" alt="{vb:rawphrase attachments_pending_approval}" /> {vb:rawphrase attachments_pending_approval}</legend>
<ul>
{vb:raw post.moderatedattachments}
</ul>
</fieldset>
</vb:if>
</div>
<!-- / attachments -->
</vb:if>
</div>
</div>
<vb:if condition="$show['postedited'] || $post['signature']">
<div class="after_content">
<vb:if condition="$show['postedited']">
<!-- edit note -->
<blockquote class="postcontent lastedited">
<vb:if condition="$show['postedithistory']">
{vb:rawphrase last_edited_link_by_x_on_y_at_z_postid, {vb:raw post.edit_username}, {vb:raw post.edit_date},
{vb:raw post.edit_time}, {vb:raw post.historyurl}}
<vb:else />
{vb:rawphrase last_edited_by_x_on_y_at_z, {vb:raw post.edit_username}, {vb:raw post.edit_date}, {vb:raw post.edit_time}}
</vb:if>
<vb:if condition="$post['edit_reason']">
<span class="reason">{vb:rawphrase reason}:</span> {vb:raw post.edit_reason}
</vb:if>
</blockquote>
<!-- / edit note -->
</vb:if>
{vb:raw template_hook.postbit_signature_start}
<vb:if condition="$post['isfirstshown']">
{vb:raw ad_location.ad_showthread_firstpost_sig}
</vb:if>
<vb:if condition="$post['signature']">
<blockquote class="signature restore" style=" padding: 1em 10px 1em; "><div class="signaturecontainer">{vb:raw post.signature}</div></blockquote>
</vb:if>
{vb:raw template_hook.postbit_signature_end}
</div>
</vb:if>
</div></div>
<div style=" position: relative; clear: both; ">
<div style="padding-bottom: 0; position: absolute; left: 0; bottom: 0; width: 100%;">
<hr style=" margin-left: 20px; margin: 0 15px; color: hsl(197, 5%, 73%); border-color: hsl(197, 5%, 73%); border-style: dotted; border-width: 1px 0 0; height: 0; ">
<div class="postfoot">
<!-- <div class="postfoot_container"> -->
<div class="textcontrols floatcontainer" style=" border-bottom-left-radius: 3px; ">
<span class="postcontrols" style=" width: 60%; ">
<img style="display:none" id="progress_{vb:raw post.postid}" src="{vb:stylevar imgdir_misc}/progress.gif" alt="{vb:rawphrase loading_editor_please_wait}" />
<vb:if condition="$post['editlink']">
<a class="editpost" href="{vb:raw post.editlink}" name="vB::QuickEdit::{vb:raw post.postid}" title="{vb:rawphrase edit_delete_message}"><img src="{vb:raw vboptions.cleargifurl}" id="editimg_{vb:raw post.postid}" alt="{vb:rawphrase edit_delete_message}" /> </a>
<vb:if condition="THIS_SCRIPT != 'usernote' && THIS_SCRIPT != 'announcement'"></vb:if>
</vb:if>
<vb:if condition="$show['quickreply'] AND !$show['threadedmode']">
<a id="qr_{vb:raw post.postid}" class='quickreply' href="{vb:raw post.replylink}&noquote=1" rel="nofollow" title="{vb:rawphrase quick_reply_to_this_message}"><img id="replyimg_{vb:raw post.postid}" src="{vb:raw vboptions.cleargifurl}" alt="{vb:rawphrase quick_reply_to_this_message}" /> </a>
</vb:if>
<vb:if condition="$post['replylink']">
<a id="qrwq_{vb:raw post.postid}" class="newreply" href="{vb:raw post.replylink}" rel="nofollow" title="{vb:rawphrase reply_with_quote}"><img id="quoteimg_{vb:raw post.postid}" src="{vb:raw vboptions.cleargifurl}" alt="{vb:rawphrase reply_with_quote}" /> <vb:if condition="$post['forwardlink']"> <vb:else /> </vb:if></a>
<vb:if condition="$show['multiquote_post']"></vb:if>
</vb:if>
<vb:if condition="$show['multiquote_post']">
<a class="multiquote" href="{vb:raw post.replylink}" rel="nofollow" onclick="return false;" id="mq_{vb:raw post.postid}" title="{vb:rawphrase multi_quote_this_message}"><img id="mq_image_{vb:raw post.postid}" src="{vb:raw vboptions.cleargifurl}" alt="{vb:rawphrase multi_quote_this_message}" /> </a>
</vb:if>
</span>
<span class="postlinking">
<vb:if condition="!$post['forwardlink'] && THIS_SCRIPT != 'usernote' && THIS_SCRIPT != 'announcement'">
<vb:if condition="$promote_sectionid AND $promote_sectionid != -1">
<a href="{vb:raw promote_url}" class="promotecms">{vb:rawphrase promote_to_article}</a>
</vb:if>
</vb:if>
{vb:raw template_hook.postbit_controls}
{vb:raw post.iplogged}
<vb:if condition="$post['forwardlink']">
<a class="forwardpost" href="{vb:raw post.forwardlink}" rel="nofollow"><img src="{vb:raw vboptions.cleargifurl}" alt="{vb:rawphrase forward_message}" /> {vb:rawphrase forward}</a>
<vb:if condition="$show['reputationlink'] OR $show['infractionlink'] OR $show['moderated'] OR $show['spam'] OR $show['deletedpost'] OR $show['redcard'] OR $show['yellowcard']"></vb:if>
</vb:if>
<vb:if condition="$show['reputationlink']">
<span class="reputationpopupmenu popupmenu popupcustom" title="{vb:raw post.postid}"><a class="popupctrl reputation" href="reputation.php?{vb:raw session.sessionurl}do=addreputation&p={vb:raw post.postid}" title="{vb:rawphrase add_reputation}" rel="nofollow" id="reputation_{vb:raw post.postid}"><!--<img src="{vb:stylevar imgdir_button}/reputation-40b.png" alt="{vb:rawphrase add_reputation}" /> --> </a></span>
</vb:if>
<vb:if condition="$show['infractionlink']">
<a class="infraction" href="infraction.php?{vb:raw session.sessionurl}do=report&p={vb:raw post.postid}" rel="nofollow" title="{vb:rawphrase add_infraction_for_x, {vb:raw post.username}}"><!-- <img src="{vb:stylevar imgdir_button}/add-infraction_sm.png" alt="{vb:rawphrase add_infraction_for_x, {vb:raw post.username}}" /> --> </a>
</vb:if>
<vb:if condition="$show['reportlink']">
<a class="report" href="{vb:raw post.reportlink}" rel="nofollow" title="{vb:rawphrase report_bad_post}"><!-- <img src="{vb:stylevar imgdir_button}/report-40b.png" alt="{vb:rawphrase report_bad_post}" /> --> </a>
</vb:if>
<vb:if condition="$show['moderated']">
<img class="moderated" src="{vb:stylevar imgdir_misc}/moderated_sm.png" alt="{vb:rawphrase moderated_post}" />
</vb:if>
<vb:if condition="$show['spam']">
<img class="spam" src="{vb:stylevar imgdir_misc}/spam_detected.png" alt="{vb:rawphrase spam_post}" />
</vb:if>
<vb:if condition="$show['deletedpost']">
<vb:if condition="$show['managepost']">
<a class="deleted" href="{vb:raw $vboptions.vbforum_url}{vb:if "$vboptions['vbforum_url']", '/', ''}postings.php?{vb:raw session.sessionurl}do=managepost&p={vb:raw post.postid}" title="{vb:rawphrase manage}"> </a>
<vb:else />
<img class="deleted_nolink" class="inlineimage" src="{vb:stylevar imgdir_button}/deleted_sm.png" alt="{vb:rawphrase deleted_post}" />
</vb:if>
</vb:if>
<vb:if condition="$show['redcard']">
<a class="redcard" href="infraction.php?{vb:raw session.sessionurl}do=view&p={vb:raw post.postid}" rel="nofollow" title="{vb:rawphrase received_infraction}"><!-- <img src="{vb:stylevar imgdir_button}/red-card_sm.png" alt="{vb:rawphrase received_infraction}" /> --> </a>
<vb:elseif condition="$show['yellowcard']" />
<a class="yellowcard" href="infraction.php?{vb:raw session.sessionurl}do=view&p={vb:raw post.postid}" rel="nofollow" title="{vb:rawphrase received_warning}"><!--<img src="{vb:stylevar imgdir_button}/yellow-card_sm.png" alt="{vb:rawphrase received_warning}" /> --> </a>
</vb:if>
<vb:if condition="$post['api_platform']">
<vb:if condition="$post['api_platform_link']">
<a class="mobile mobile_{vb:raw post.api_platform}" href="{vb:raw post.api_platform_link}" rel="nofollow" title="{vb:rawphrase {vb:raw post['api_platform_link_title']}}">{vb:rawphrase {vb:raw post['api_platform_link_phrase']}}</a>
<vb:else />
<span class="mobile mobile_{vb:raw post.api_platform}">{vb:rawphrase {vb:raw post['api_platform_link_phrase']}}</span>
</vb:if>
</vb:if>
</span>
<!-- </div> -->
</div>
</div>
</div>
</div>
<div class="cleardiv"></div>
</div>
</div>
<hr />
</li>
{vb:raw template_hook.postbit_end}
The difference is this part (Dropped the left: references and added right: -13px; to the first div and added right: -10px to the second div):
HTML Code:
<div style=" border-left-color: hsl(200, 6%, 80%); border-top-color: hsl(200, 6%, 80%); border-bottom-color: hsl(200, 6%, 80%); top: 34px; border-left: 13px solid hsl(200, 6%, 80%); border-top: 7px solid transparent; border-bottom: 7px solid transparent; right: -13px; position: absolute; background: transparent; height: 0; width: 0; "></div>
<div style=" border-left-color: white; border-top-color: hsl(200, 6%, 80%); border-bottom-color: hsl(200, 6%, 80%); top: 35px; border-left: 10px solid white; border-top: 6px solid transparent; border-bottom: 6px solid transparent; right: -10px; position: absolute; background: transparent; height: 0; width: 0; "></div>
More Information