Bị lỗi giao diện avatar cần anh em giúp đỡ

quenloivex

Private
7yOP30cbTVWVVQGU4kw6W3hxwzwT6O3AHngO1A3-lA=w683-h355-no

Mình bị lỗi giao diện như hình trên , tự nhiên có thanh dài chạy qua không biết cách nào fixx được :(

Với lại cho mình hỏi thêm là có cách nào dời qua bên phải để cho 2 cột khỏi đụng nhau không
2G9MC0H9lo-8tHjMmg1Fj3a87SW9Fcq1lBhdXPgX2A=w670-h345-no
 
Sửa lần cuối:
lỗi gì thì phải cho cái demo mới xem đc css thì mới giúp bạn đc chứ! còn cái kia thì bạn chỉnh width cho nó rộng ra tí thì nó khỏi lấn qua :)
 
Mình mới gia nhập nên không biết chỉnh width ở phần nào hết bạn, chỉnh width rộng ra có ảnh hưởng đến giao diện của diễn đàn không,

còn cho xem demo là phải cho bạn coi làm sao
 
  • Like
Reactions: THB
Hiện giờ mình vào chỗ messenger_user_info mà ko biết nó bị lỗi phần nào , bạn cho mình xin code đó mình đè lên code mình là xong chứ vào temp nó nhiều phần quá :(

Mã:
<xen:require css="message_user_info.css" />

<div class="messageUserInfo" itemscope="itemscope" itemtype="http://data-vocabulary.org/Person">   
<div class="messageUserBlock {xen:if $user.isOnline, online}">
    <xen:hook name="message_user_info_avatar" params="{xen:array 'user={$user}', 'isQuickReply={$isQuickReply}'}">
        <div class="avatarHolder">
            <span class="helper"></span>
            <xen:avatar user="$user" size="m" img="true" />
            <xen:if is="{$user.isOnline}"><span class="Tooltip onlineMarker" title="{xen:phrase online_now}" data-offsetX="-22" data-offsetY="-8"></span></xen:if>
            <!-- slot: message_user_info_avatar -->
        </div>
    </xen:hook>

<xen:if is="!{$isQuickReply}">
    <xen:hook name="message_user_info_text" params="{xen:array 'user={$user}', 'isQuickReply={$isQuickReply}'}">
        <h3 class="userText">
            <xen:username user="$user" itemprop="name" rich="true" />
            <xen:if hascontent="true"><em class="userTitle" itemprop="title"><xen:contentcheck>{xen:helper userTitle, $user, 1, 1}</xen:contentcheck></em></xen:if>
            {xen:helper userBanner, $user, 'wrapped'}
            <!-- slot: message_user_info_text -->
        </h3>
    </xen:hook>
       
    <xen:if hascontent="true">
        <div class="extraUserInfo">
            <xen:contentcheck>
            <xen:hook name="message_user_info_extra" params="{xen:array 'user={$user}', 'isQuickReply={$isQuickReply}'}">
                <xen:if is="@messageShowRegisterDate AND {$user.user_id}">
                    <dl class="pairsJustified">
                        <dt>{xen:phrase joined}:</dt>
                        <dd>{xen:date $user.register_date}</dd>
                    </dl>
                </xen:if>
               
                <xen:if is="@messageShowMessageCount AND {$user.user_id}">
                    <dl class="pairsJustified">
                        <dt>{xen:phrase messages}:</dt>
                        <dd><a href="{xen:link search/member, '', 'user_id={$user.user_id}'}" class="concealed" rel="nofollow">{xen:number $user.message_count}</a></dd>
                    </dl>
                </xen:if>
               
                <xen:if is="@messageShowTotalLikes AND {$user.user_id}">
                    <dl class="pairsJustified">
                        <dt>{xen:phrase likes_received}:</dt>
                        <dd>{xen:number $user.like_count}</dd>
                    </dl>
                </xen:if>
               
                <xen:if is="@messageShowTrophyPoints AND {$user.user_id}">
                    <dl class="pairsJustified">
                        <dt>{xen:phrase trophy_points}:</dt>
                        <dd><a href="{xen:link 'members/trophies', $user}" class="OverlayTrigger concealed">{xen:number $user.trophy_points}</a></dd>
                    </dl>
                </xen:if>
           
                <xen:if is="@messageShowGender AND {$user.gender}">
                    <dl class="pairsJustified">
                        <dt>{xen:phrase gender}:</dt>
                        <dd itemprop="gender"><xen:if is="{$user.gender} == 'male'">{xen:phrase male}<xen:else />{xen:phrase female}</xen:if></dd>
                    </dl>
                </xen:if>
               
                <xen:if is="@messageShowOccupation AND {$user.occupation}">
                    <dl class="pairsJustified">
                        <dt>{xen:phrase occupation}:</dt>
                        <dd itemprop="role">{xen:string censor, $user.occupation}</dd>
                    </dl>
                </xen:if>
               
                <xen:if is="@messageShowLocation AND {$user.location}">
                    <dl class="pairsJustified">
                        <dt>{xen:phrase location}:</dt>
                        <dd><a href="{xen:link 'misc/location-info', '', 'location={xen:string censor, $user.location, '-'}'}" target="_blank" rel="nofollow" itemprop="address" class="concealed">{xen:string censor, $user.location}</a></dd>
                    </dl>
                </xen:if>
           
                <xen:if is="@messageShowHomepage AND {$user.homepage}">
                    <dl class="pairsJustified">
                        <dt>{xen:phrase home_page}:</dt>
                        <dd><a href="{xen:string censor, $user.homepage, '-'}" rel="nofollow" target="_blank" itemprop="url">{xen:string censor, $user.homepage}</a></dd>
                    </dl>
                </xen:if>
                           
            </xen:hook>           
            <xen:if is="@messageShowCustomFields AND {$user.customFields}">
            <xen:hook name="message_user_info_custom_fields" params="{xen:array 'user={$user}', 'isQuickReply={$isQuickReply}'}">
           
                <xen:foreach loop="$userFieldsInfo" key="$fieldId" value="$fieldInfo">
                    <xen:if is="{$fieldInfo.viewable_message} AND ({$fieldInfo.display_group} != 'contact' OR {$user.allow_view_identities} == 'everyone' OR ({$user.allow_view_identities} == 'members' AND {$visitor.user_id}))">
                        <xen:if hascontent="true">
                            <dl class="pairsJustified userField_{$fieldId}">
                                <dt>{xen:helper userFieldTitle, $fieldId}:</dt>
                                <dd><xen:contentcheck>{xen:helper userFieldValue, $fieldInfo, $user, {$user.customFields.{$fieldId}}}</xen:contentcheck></dd>
                            </dl>
                        </xen:if>
                    </xen:if>
                </xen:foreach>
               
            </xen:hook>
            </xen:if>
            </xen:contentcheck>
        </div>
    </xen:if>
       
</xen:if>

    <span class="arrow"><span></span></span>
</div>
</div>

message_user_info.css

Mã:
.messageUserInfo
{
    @property "messageUserInfo";
    margin-bottom: 20px;
    @property "/messageUserInfo";
}

    .messageUserBlock
    {
        @property "messageUserBlock";
        background: @primaryLighterStill url('@imagePath/xenforo/gradients/tab-selected-light.png') repeat-x bottom;
        border: 1px solid @primaryLighterStill;
        border-radius: 5px;
        height: 122px;
        @property "/messageUserBlock";
       
        position: relative;
    }
       
        .messageUserBlock div.avatarHolder
        {
            @property "messageAvatarHolder";
            background-color: @primaryLightest;
            padding: 10px;
            margin-right: 15px;
            border-radius: 4px;
            float: left;
            @property "/messageAvatarHolder";
           
            position: relative;   
        }
       
            .messageUserBlock div.avatarHolder .avatar
            {
                display: block;
                font-size: 0;
            }
           
            .messageUserBlock div.avatarHolder .onlineMarker
            {
                position: absolute;
                top: {xen:calc '@messageAvatarHolder.padding-top - 1'}px;
                left: {xen:calc '@messageAvatarHolder.padding-right - 1'}px;
               
                @property "messageOnlineMarker";
                border: 7px solid transparent;
                border-top-color: rgb(127, 185, 0);
                border-left-color: rgb(127, 185, 0);
                border-top-left-radius: 5px;
                border-top-right-radius: 3px;
                border-bottom-left-radius: 3px;
                @property "/messageOnlineMarker";
            }
           
        .messageUserBlock h3.userText
        {
            @property "messageUserText";
            padding: 6px;
            @property "/messageUserText";
        }
       
        .messageUserBlock .userBanner
        {
            display: block;
            margin-bottom: 5px;
            margin-left: -{xen:calc '@messageUserText.padding-left + 6'}px;
            margin-right: -{xen:calc '@messageUserText.padding-right + 6'}px;
        }
       
        .messageUserBlock .userBanner:last-child
        {
            margin-bottom: 0;
        }
   
        .messageUserBlock a.username
        {
            @property "messageUsername";
            font-weight: bold;
            display: inline;
            overflow: hidden;
            line-height: 16px;
            @property "/messageUsername";
           
        }
       
        .messageUserBlock .userTitle
        {
            @property "messageUserTitle";
            font-size: 11px;
            margin-bottom: 16px;
            display: block;
            @property "/messageUserTitle";
        }
       
        .messageUserBlock .extraUserInfo
        {
            @property "messageExtraUserInfo";
            font-size: 10px;
            background-color: @primaryLightest;
            padding: 10px 10px 7px;
            margin: -58px 0;
            border-radius: 4px;
            float: right;
            height: 105px;
            @property "/messageExtraUserInfo";
        }
       
            .messageUserBlock .extraUserInfo dl
            {
                margin: 2px 0 0;
            }
                           
            .messageUserBlock .extraUserInfo img
            {
                max-width: 100%;
            }
       
        .messageUserBlock .arrow
        {
            position: absolute;
            top: 10px;
            right: -10px;
           
            display: block;
            width: 0px;
            height: 0px;
            line-height: 0px;
           
            border: 10px solid transparent;
            border-left-color: @messageUserBlock.border-color;
            -moz-border-left-colors: @messageUserBlock.border-color;
            border-right: none;
           
            /* Hide from IE6 */
            _display: none;
        }
       
            .messageUserBlock .arrow span
            {
                position: absolute;
                top: -10px;
                left: -11px;
               
                display: block;
                width: 0px;
                height: 0px;
                line-height: 0px;
               
                border: 10px solid transparent;
                border-left-color: @messageAvatarHolder.background-color;
                -moz-border-left-colors: @messageAvatarHolder.background-color;
                border-right: none;
            }

<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveNarrowWidth)
{
    .Responsive .messageUserInfo
    {
        float: none;
        width: auto;
    }

    .Responsive .messageUserBlock
    {
        overflow: hidden;
        margin-bottom: 5px;
        position: relative;
    }

    .Responsive .messageUserBlock div.avatarHolder
    {
        float: left;
        padding: 5px;
    }

        .Responsive .messageUserBlock div.avatarHolder .avatar img
        {
            width: 48px;
            height: 48px;
        }
       
        .Responsive .messageUserBlock div.avatarHolder .onlineMarker
        {
            top: 4px;
            left: 4px;
            border-width: 6px;
        }

    .Responsive .messageUserBlock h3.userText
    {
        margin-left: 64px;
    }
   
    .Responsive .messageUserBlock .userBanner
    {
        max-width: 150px;
        margin-left: 0;
        margin-right: 0;
        border-top-left-radius: 3px;
        border-top-right-radius: 3px;
        position: static;
        display: inline-block;
    }
   
        .Responsive .messageUserBlock .userBanner span
        {
            display: none;
        }

    .Responsive .messageUserBlock .extraUserInfo
    {
        display: none;
    }

    .Responsive .messageUserBlock .arrow
    {
        display: none;
    }
}
</xen:if>
 
  • Like
Reactions: THB
cái này do lỗi style thôi :), cài cái khác chắc là ok, còn cho về mặc định thì bạn nhìn xem bên phải tên template đó có dấu X màu đỏ không, nếu có thì bấm vào đó rồi ấn tiếp revent template
 
Back
Top