cách chuyển avartar dọc sang ngang

Ai biết cách chuyển cái này từ dọc sang ngay hay không. Hình ảnh bên dưới

 

up ai hộ em phát

 

up ai hộ em vs

 

cái nào????

 

như hình dưới nè bác

 

Chào các bạn!
Bài này sẽ hướng dẫn các bạn cách hiển thị bài viết đầu tiên dạng nằm ngang, các reply sẽ hiển thị theo kiểu mặc định.
Đề nghị làm đúng lần lượt các bước
1. Vào EXTRA.css thêm đoạn code này vào:

Mã:

Mã:

/*Display Postbit in first post*/
.firstPost .messageUserInfo {
    float: none;
}
.firstPost .messageUserInfo .messageUserBlock .arrow {
    display: none;
}
.firstPost .messageInfo {
    margin-left: 5px !important;
    margin-top: 10px;
}
.newIndicator {
    display: none !important;
}
.firstPost .messageUserInfo {
    width: 100% !important;
}
.firstPost .messageUserInfo .messageUserBlock .arrow {
    display: none;
}
.firstPost .messageUserBlock {
    -moz-border-bottom-colors: none !important;
    -moz-border-image: none !important;
    -moz-border-left-colors: none !important;
    -moz-border-right-colors: none !important;
    -moz-border-top-colors: none !important;
    background: none repeat scroll 0 0 transparent !important;
    border-color: -moz-use-text-color -moz-use-text-color #CDE5F0 !important;
    border-style: none none dashed !important;
    border-width: 0 0 1px !important;
    height: 64px;
}
.firstPost .avatar .img {
    margin-left: 0 !important;
}
.firstPost .avatarHolder {
    padding: 0 !important;
    position: absolute !important;
}
.firstPost .userText {
    margin-left: 58px;
    position: absolute !important;
    top: 18px;
}
.firstPost .tt_share_page {
    margin-left: 220px;
    position: absolute;
    top: 34px;
    width: 420px;
}
.firstPost .shareControl {
    float: right;
}
.firstPost .addthis {
    padding-left: 20px;
}
.titleBar h1 {
    font-size: 20pt !important;
}

2.vào Templates/creat new template/
Tiêu đề: message_user_info_firstpost
Với Nội Dung Nhứ Sau:


Mã:

Mã:

<xen:require css="message_user_info.css" />
 
<div class="messageUserInfo" style="box-shadow: none !important;" itemscope="itemscope" itemtype="http://data-vocabulary.org/Person">
<div class="messageUserBlock">
    <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="s"/>
            <!-- 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}</xen:contentcheck></em></xen:if> -->
            <!-- slot: message_user_info_text -->
            <xen:if is="{$user.is_admin}"><span class="userrank"><img src="http://**[LINK FORBIDDEN]**/thumucupload/VN2.png"></span>
            <xen:elseif is="{$user.user_group_id} == 4"/><span class="userrank"><img src=""></span>
            <xen:elseif is="{$user.user_group_id} == 9"/><span class="userrank"><img src="http://**[LINK FORBIDDEN]**/thumucupload/VN1.png"></span>
            <xen:elseif is="{$user.user_group_id} == 2"/><span class="userrank"><img src="http://**[LINK FORBIDDEN]**/thumucupload/VN.png"></span>
            <xen:elseif is="{$user.user_group_id} == 8"/><span class="userrank"><img src="styles/ranks/banned.gif"></span></xen:if>
        </h3>
    </xen:hook>
 
</xen:if>
 
<xen:if is="!{$isQuickReply}"> 
    <xen:if hascontent="true">
        <div style="float: right; margin-top: -5px;">
            <xen:contentcheck>
            <xen:hook name="message_user_info_extra" params="{xen:array 'user={$user}', 'isQuickReply={$isQuickReply}'}">
                <xen:if is="@messageShowRegisterDate">
                    <dl class="pairsInline" style="padding-bottom:2px">
                      Tham gia ngày {xen:date $user.register_date}
                    </dl>
                </xen:if>
         
                <xen:if is="@messageShowMessageCount">
                    <dl class="pairsInline" style="padding-bottom:2px">
                        {xen:phrase message_count}:
                        <a href="{xen:link search/member, '', 'user_id={$user.user_id}'}" class="concealed">{xen:number $user.message_count}</a>
                    </dl>
                </xen:if>
         
                <xen:if is="@messageShowTotalLikes">
                    <dl class="pairsInline" style="padding-bottom:2px">
                        {xen:phrase likes_received}:
                        {xen:number $user.like_count}
                    </dl>
                </xen:if>
         
                <xen:if is="@messageShowTrophyPoints">
                    <dl class="pairsInline" style="padding-bottom:2px">
                        {xen:phrase trophy_points}:
                        <a href="{xen:link 'members/trophies', $user}" class="OverlayTrigger concealed">{xen:number $user.trophy_points}</a>
                    </dl>
                </xen:if>
     
                <xen:if is="@messageShowGender AND {$user.gender}">
                    <dl class="pairsInline" style="padding-bottom:2px">
                        {xen:phrase gender}:
                        <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="pairsInline" style="padding-bottom:2px">
                        {xen:phrase occupation}:
                        <dd itemprop="role">{xen:string censor, $user.occupation}</dd>
                    </dl>
                </xen:if>
         
                <xen:if is="@messageShowLocation AND {$user.location}">
                    <dl class="pairsInline" style="padding-bottom:2px">
                        {xen:phrase location}:
                        <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>
                    </dl>
                </xen:if>
     
                <xen:if is="@messageShowHomepage AND {$user.homepage}">
                    <dl class="pairsInline" style="padding-bottom:2px">
                        {xen:phrase home_page}:
                        <a href="{xen:string censor, $user.homepage, '-'}" rel="nofollow" target="_blank" itemprop="url">{xen:string censor, $user.homepage}</a>
                    </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}">
                        <xen:if hascontent="true">
                            <dl class="pairsInline 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>
<xen:if is="{$post.position} == 0 AND !{$message.conversation_id}">
<span class="tt_share_page">
<!-- AddThis Button BEGIN -->
<div class="addthis_toolbox addthis_default_style ">
<a class="addthis_button_facebook_like" fb:like:layout="button_count"></a>
<a class="addthis_button_tweet"></a>
<a class="addthis_button_google_plusone" g:plusone:size="medium"></a>
<a class="addthis_counter addthis_pill_style"></a>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=devilchild"></script>
<!-- AddThis Button END -->
</span>
</xen:if>
    <span class="arrow"><span></span></span>
</div>
</div>

template: message
Tìm:

Mã:

Mã:

<li id="{$messageId}" class="message {xen:if $message.isDeleted, 'deleted'} {xen:if '{$message.is_admin} OR {$message.is_moderator}', 'staff'} {xen:if $message.isIgnored, ignored}" data-author="{$message.username}">
    <xen:include template="message_user_info">
        <xen:map from="$message" to="$user" />
    </xen:include>

Thay bằng:
Mã:
<xen:if is="{$post.position} == 0">
<li id="{$messageId}" class="message firstPost {xen:if $message.isDeleted, 'deleted'} {xen:if '{$message.is_admin} OR {$message.is_moderator}', 'staff'} {xen:if $message.isIgnored, ignored}" data-author="{$message.username}">
<xen:include template="message_user_info_firstpost">
<xen:map from="$message" to="$user" />
</xen:include>
<xen:else />
<li id="{$messageId}" class="message {xen:if $message.isDeleted, 'deleted'} {xen:if '{$message.is_admin} OR {$message.is_moderator}', 'staff'} {xen:if $message.isIgnored, ignored}" data-author="{$message.username}">
<xen:include template="message_user_info">
<xen:map from="$message" to="$user" />
</xen:include>
</xen:if>

 

Thanks đã thành công

 

bị lỗi rồi bác ơi

 

demo của bạn đâu xem thành của ban

 

Mình đã xóa rồi. Lúc nãy vô xem nó hiện ra đống code lỗi

 

Mình làm cái avatar ngang này 2 ngày nay rồi mà không đc,@Xuanhien Nguyen có thể giúp mình đc ko. Mình làm theo hướng dẫn nhưng ko luu đc trong EXTRA.css. Để minh đưa code web bạn xem thử