[Đóng góp] View ngang có avatar drop và khung quote, code, spoiler của DEVs

View ngang có avatar drop và khung quote, code, spoiler của DEVs
Có nút xem pet, khi click vào nó sẽ trượt khung thông tin ra và hiện khung pet
Vui lòng không đem tung hàng đi nơi khác một cách quá lộ liễu :v

À thêm cái lưu ý nữa là méo không hề động chạm tí gì đến js nên khi click vào nút [xêm pết] nó sẽ trượt cái khung profile và phải click ra ngoài nó mới chịu trở lại như cũ. Tại ở đây méo xài :focus nên càng bấm nút [xêm pết] nó càng không chịu về vị trí ban đầu :)

Code:

<!-- BEGIN switch_user_logged_in -->
<div id="pun-visit" class="clearfix">
  <ul>
      <!-- BEGIN switch_plus_menu -->
      <li>
        <script type="text/javascript">//<![CDATA[
            var url_favourite = '{switch_user_logged_in.U_FAVOURITE_JS_PLUS_MENU}';
            var url_newposts = '{U_NEWPOSTS_JS_PLUS_MENU}';
            var url_egosearch = '{U_EGOSEARCH_JS_PLUS_MENU}';
            var url_unanswered = '{U_UNANSWERED_JS_PLUS_MENU}';
            var url_watchsearch = '{U_WATCHSEARCH_JS_PLUS_MENU}';
            var url_tellfriend = '{U_TELLFRIEND_JS_PLUS_MENU}';
            insert_plus_menu_new('f{FORUM_ID}&amp;t={TOPIC_ID}','{JS_SESSION_ID}', {JS_AUTH_FAVOURITES});
        //]]>
        </script>
      </li>
      <!-- END switch_plus_menu -->
     
      <li><a href="{U_SEARCH_NEW}">{L_SEARCH_NEW}</a></li>
      <li><a href="{U_SEARCH_SELF}">{L_SEARCH_SELF}</a></li>
      <!-- BEGIN watchtopic -->
      <li>{S_WATCH_TOPIC}</li>
      <!-- END watchtopic -->
  </ul>
  <p>{LOGGED_AS}. {LAST_VISIT_DATE}</p>
</div>
<!-- END switch_user_logged_in -->
<!-- BEGIN switch_user_logged_out -->
<div id="pun-visit">
  <p>{L_NOT_CONNECTED} {L_LOGIN_REGISTER}</p>
</div>
<!-- END switch_user_logged_out -->

<div class="pun-crumbs noprint">
  <p class="crumbs">
      <a href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC} »
      <strong><a href="{TOPIC_URL}">{TOPIC_TITLE}</a></strong>
   
  </p>
</div>

<div class="main paged">
  <div class="paged-head clearfix">
      <!-- BEGIN topicpagination -->
      <p class="paging">{PAGINATION}</p>
      <!-- END topicpagination -->
      <p class="posting">
        <!-- BEGIN switch_user_authpost -->
        <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" class="{POST_IMG_CLASS}" alt="{L_POST_NEW_TOPIC}" /></a> 
        <!-- END switch_user_authpost -->

        <!-- BEGIN switch_user_authreply -->
        <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" class="i_reply" alt="{L_POST_REPLY_TOPIC}" /></a>
        <!-- END switch_user_authreply -->
      </p>
  </div>
  {POLL_DISPLAY}
  <div class="main-head clearfix">
      <p class="h2">
        <a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a> <a href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a> <a href="#bottom">{L_GOTO_DOWN}</a> 
        {L_MESSAGE} [{PAGE_NUMBER}]
      </p>
  </div>

  <div class="main-content topic">
      <!-- BEGIN postrow -->
        <!-- BEGIN displayed -->
<div class="post"{postrow.displayed.THANK_BGCOLOR}></div>
<table align="center" cellpadding="0" cellspacing="0" style="width: 100%; ">
  <tbody>
    <tr><td class="vifuser"><div class="petvif">{postrow.displayed.POSTER_RPG}</div><button class="xempet">Xem pet</button><div class="infovifus" style="width:100%;height:150px;">
       
       
        <div class="user-ident dropRight"><div class="poster-avatar">{postrow.displayed.POSTER_AVATAR}</div>
        <div class="poster-info"><div>
          <span class="poster-name">{postrow.displayed.POSTER_NAME}</span>
          <span class="poster-connect">{postrow.displayed.ONLINE_IMG}</span>
          <span class="poster-rank">{postrow.displayed.RANK_IMAGE}</span>
        </div>
        <div class="poster-field"> <!-- BEGIN profile_field --><p>
        {postrow.displayed.profile_field.LABEL}{postrow.displayed.profile_field.CONTENT}</p>
        <!-- END profile_field --></div>
        <div class="poster-link">
        <a target="_blank" href="/profile.forum?mode=viewprofile&u=[POSTER_NAME]&page_profil=messages">
          <img alt="Tường nhà" src="http://i48.servimg.com/u/f48/16/58/89/73/profil10.png" />Tường nhà
        </a>
          <a target="_blank" href="/spa/[POSTER_NAME]">
        <img alt="Xem bài viết" src="http://i48.servimg.com/u/f48/16/58/89/73/total_10.gif" />Bài viết
          </a>
        <a target="_blank" href="/profile?friend=[POSTER_NAME]&mode=editprofile&page_profil=friendsfoes">
          <img alt="Kết bạn" src="http://i48.servimg.com/u/f48/16/58/89/73/friend10.png" />Kết bạn
        </a>
          <a target="_blank" href="/profile?foe=[POSTER_NAME]&mode=editprofile&page_profil=friendsfoes">
        <img alt="Chặn người này" src="http://i57.servimg.com/u/f57/17/05/17/70/button10.png" />Ngăn cấm
          </a></div></div></div>
      </div></td>
    </tr>
  </tbody>
</table>
<table align="center" border="0" cellpadding="0" cellspacing="0" style="width: 100%; ">
  <tbody>
      <tr>
        <td>
            <a name="{postrow.displayed.U_POST_ID}"></a>
            <div class="postmain"{postrow.displayed.THANK_BGCOLOR}>
  </div>
                        <div id="p{postrow.displayed.U_POST_ID}" class="posthead"{postrow.displayed.THANK_BGCOLOR}>
            <h2>
              <strong>Bài viết: {postrow.displayed.COUNT_POSTS}</strong>
              {postrow.displayed.ICON} <a href="{postrow.displayed.POST_URL}">{postrow.displayed.POST_SUBJECT}</a> {postrow.displayed.POST_DATE_NEW}
            </h2>
        </div>
              <div class="postbody"{postrow.displayed.THANK_BGCOLOR}>
                  <div class="post-entry">
                    <div class="entry-content">
                        <!-- BEGIN switch_vote_active -->
                        <div class="vote gensmall">
                          <!-- BEGIN switch_vote -->
                          <div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}">+</a></div>
                          <!-- END switch_vote -->

                          <!-- BEGIN switch_bar -->
                          <div class="vote-bar" title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}">
                              <!-- BEGIN switch_vote_plus -->
                              <div class="vote-bar-plus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;"></div>
                              <!-- END switch_vote_plus -->

                              <!-- BEGIN switch_vote_minus -->
                              <div class="vote-bar-minus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></div>
                              <!-- END switch_vote_minus -->
                          </div>
                          <!-- END switch_bar -->

                          <!-- BEGIN switch_no_bar -->
                          <div title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}" class="vote-no-bar">----</div>
                          <!-- END switch_no_bar -->

                          <!-- BEGIN switch_vote -->
                          <div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}">-</a></div>
                          <!-- END switch_vote -->
                        </div>
                        <!-- END switch_vote_active -->
                        <div>
                          <div>{postrow.displayed.MESSAGE}</div>
                          <!-- BEGIN switch_attachments -->
                          <dl class="attachbox">
                              <dt>{postrow.displayed.switch_attachments.L_ATTACHMENTS}</dt>
                              <dd>
                                <!-- BEGIN switch_post_attachments -->
                                <dl class="file">
                                    <dt>
                                      <img src="{postrow.displayed.switch_attachments.switch_post_attachments.U_IMG}" />

                                      <!-- BEGIN switch_dl_att -->
                                      <a class="postlink" href="{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.U_ATTACHMENT}">{postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT}</a> {postrow.displayed.switch_attachments.switch_post_attachments.switch_dl_att.ATTACHMENT_DEL}
                                      <!-- END switch_dl_att -->

                                      <!-- BEGIN switch_no_dl_att -->
                                      {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT} {postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.ATTACHMENT_DEL}
                                      <!-- END switch_no_dl_att -->
                                    </dt>

                                    <!-- BEGIN switch_no_comment -->
                                    <dd>
                                      <em>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_comment.ATTACHMENT_COMMENT}</em>
                                    </dd>
                                    <!-- END switch_no_comment -->

                                    <!-- BEGIN switch_no_dl_att -->
                                    <dd>
                                      <em><strong>{postrow.displayed.switch_attachments.switch_post_attachments.switch_no_dl_att.TEXT_NO_DL}</strong></em>
                                    </dd>
                                    <!-- END switch_no_dl_att -->

                                    <dd>({postrow.displayed.switch_attachments.switch_post_attachments.FILE_SIZE}) {postrow.displayed.switch_attachments.switch_post_attachments.NB_DL}</dd>
                                </dl>
                                <!-- END switch_post_attachments -->
                              </dd>
                          </dl>
                          <!-- END switch_attachments -->
                          <div class="clear"></div>
                        </div>
                        <p>
                          {postrow.displayed.EDITED_MESSAGE}
                        </p>
                    </div>
                  </div>
              </div>

              <!-- BEGIN switch_signature -->
              <div class="sig-content">
                  <hr>{postrow.displayed.SIGNATURE_NEW}</div>
              <!-- END switch_signature -->

                                <div class="postmain"{postrow.displayed.THANK_BGCOLOR}>
            <div class="postfoot">
                  <div class="user-contact">
                    {postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG} {postrow.displayed.EMAIL_IMG}<!-- BEGIN contact_field --> {postrow.displayed.contact_field.CONTENT}<!-- END contact_field -->
                  </div>
                  <div class="post-options">
                    {postrow.displayed.THANK_IMG} {postrow.displayed.MULTIQUOTE_IMG} {postrow.displayed.QUOTE_IMG} {postrow.displayed.EDIT_IMG} {postrow.displayed.DELETE_IMG} {postrow.displayed.IP_IMG} {postrow.displayed.REPORT_IMG}
                  </div>
                                  <div style="clear:both;"></div></div>
                                  </div>
                    </td>
      </tr>
  </tbody>
</table>
        <!-- BEGIN first_post_br -->
      </div>
      <hr id="first-post-br" />
      <div class="main-content topic">
        <!-- END first_post_br -->
        <!-- END displayed -->
        <!-- BEGIN hidden -->
            <p class="p-hidden">{postrow.hidden.MESSAGE}</p>
        <!-- END hidden -->
      <!-- END postrow -->
  </div>

  <div class="main-foot clearfix">
      <p class="h2">
        <a href="{U_VIEW_OLDER_TOPIC}">{L_VIEW_PREVIOUS_TOPIC}</a> <a href="{U_VIEW_NEWER_TOPIC}">{L_VIEW_NEXT_TOPIC}</a> <a href="#top">{L_BACK_TO_TOP}</a> 
        {L_MESSAGE} [{PAGE_NUMBER}]
      </p>
      <p class="options">
        <input type="hidden" name="t" value="{TOPIC_ID}" />

        <!-- <input type="hidden" name="sid" value="{S_SID}" /> -->
        <input type="hidden" name="{SECURE_ID_NAME}" value="{SECURE_ID_VALUE}" />

        <!-- BEGIN viewtopic_bottom -->
        {S_TOPIC_ADMIN}
        <!-- END viewtopic_bottom -->
      </p>
  </div>

  <a name="bottomtitle"></a>

  <div class="paged-foot clearfix">
      <!-- BEGIN topicpagination -->
      <p class="paging">{PAGINATION}</p>
      <!-- END topicpagination -->
    <p class="posting">
        <!-- BEGIN switch_user_authpost -->
        <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" class="{POST_IMG_CLASS}" alt="{L_POST_NEW_TOPIC}" /></a> 
        <!-- END switch_user_authpost -->

        <!-- BEGIN switch_user_authreply -->
        <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" class="i_reply" alt="{L_POST_REPLY_TOPIC}" /></a>
        <!-- END switch_user_authreply -->
      </p>
  </div>

</div>

<div class="pun-crumbs">
  <p class="crumbs">
      <a href="{U_INDEX}">{L_INDEX}</a>{NAV_CAT_DESC} »
      <strong><a href="{TOPIC_URL}">{TOPIC_TITLE}</a></strong>
  </p>
</div>

<!-- BEGIN promot_trafic -->

<!-- END promot_trafic -->

<!-- BEGIN switch_forum_rules -->
<div class="main" id="forum_rules">
  <div class="main-head clearfix">
      <p class="h2">{L_FORUM_RULES}</p>
  </div>
  <table class="main-content frm">
      <tr>
        <!-- BEGIN switch_forum_rule_image -->
        <td class="logo">
            <img src="{RULE_IMG_URL}" />
        </td>
        <!-- END switch_forum_rule_image -->
        <td class="rules entry-content">
            {RULE_MSG}
        </td>
      </tr>
  </table>
</div>
<!-- END switch_forum_rules -->

<!-- BEGIN switch_user_logged_in -->
<a name="quickreply"></a>
{QUICK_REPLY_FORM}
<!-- END switch_user_logged_in -->

<div id="pun-info" class="main">
  <div class="main-content">
      <div id="stats">
        <p>{L_TABS_PERMISSIONS} <br />{S_AUTH_LIST}</p>
      </div>
  </div>
</div>

<!-- BEGIN switch_image_resize -->
<script type="text/javascript">
//<![CDATA[
$(resize_images({ 'selector' : '.post-entry .entry-content', 'max_width' : {switch_image_resize.IMG_RESIZE_WIDTH}, 'max_height' : {switch_image_resize.IMG_RESIZE_HEIGHT} }));
//]]>
</script>
<!-- END switch_image_resize -->
<script type="text/javascript">
$(".poster-info .label:contains('Status')").parent().addClass("status");
$(".poster-link a").attr("href", function () {
  return this.href.replace("[POSTER_NAME]", encodeURI($(this).closest(".poster-info").find(".poster-name strong").text()));
});
</script>

Code:

/* Spoiler + code + quote */
.codebox{background:transparent;border:0 none;margin:0 0 10px;box-shadow: 0px 0px 0px #000!important;border-radius:0px !important}
.codebox dd{background:transparent;margin:0;padding:0}
.codebox > dt{position:relative;background:url(http://i83.servimg.com/u/f83/16/58/89/73/page_w10.png) no-repeat scroll 10px center #777;color:#FFF;border:1px solid #e2e2e2;height:30px;border-bottom-width:0;line-height:26px;padding:2px 10px 0 30px;width:90px}
.codebox dd.cont_code{background:#FFF;max-height:100%;overflow:visible;position:relative;border:1px solid #e2e2e2}
.cont_code > code{overflow:auto;white-space:pre;display:block;line-height:17px;padding:10px}
.codebox.spoiler{border:1px solid #e2e2e2}
.codebox.spoiler > dt{border:0;background:url(http://i83.servimg.com/u/f83/16/58/89/73/icon-a10.gif) no-repeat 10px center #777;width:95.5%}
.codebox > dt:hover{color:#333;background-color:#F2F2F2}
.spoiler_content{color:#333;margin:10px 20px}
blockquote cite{font-size:13px;text-decoration:italic;background:url(http://i83.servimg.com/u/f83/16/58/89/73/commen10.gif) no-repeat left 2px transparent!important;margin:0!important;padding:0 0 3px 20px;font-weight:bold;}
blockquote{border:1px solid!important;border-color:#DDD!important;color:#333;position:relative;margin:0 0 10px 10px;padding:10px 15px!important;background:transparent!important}
blockquote:before{content:'';display:inline-block;border-top:10px solid transparent;border-bottom:10px solid transparent;border-right:10px solid #CCC;position:absolute;top:10px;left:-10px}
blockquote:after{content:'';display:inline-block;border-top:9px solid transparent;border-bottom:9px solid transparent;border-right:9px solid #fff;position:absolute;top:11px;left:-9px}
/*view devs bản ngang*/
.pun .postbody{background:#fff!important}
.postfoot{margin-left:0px!important}
.dropRight,.dropRight *{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box}
.pun .post .user{overflow:visible;margin-left:-13em;width:12em}
.pun .postmain{margin-left:-1px}
.pun .post:hover{border-left:1px solid #359bed;margin-left:-1px}
.dropRight{z-index:10;position:relative;background:transparent;border:1px solid transparent;width:1px;margin-left:-3px;white-space:nowrap;transition:width .2s;-webkit-transition:width .2s;overflow:hidden;padding:10px 0 10px 13em !important}
.dropRight:hover{background:#fff;width:542px;border-color:#359bed #359bed #359bed #d7d7d7}
.dropRight .poster-avatar{float:left;margin-left:-12em}
.dropRight .poster-avatar a{background:url(http://i56.servimg.com/u/f56/18/59/49/93/noavat10.jpg) no-repeat center #FFF;border:1px solid #DDD;min-height:122px;display:block;width:132px}
.dropRight .poster-avatar img{background:#FFF;min-height:122px;max-height:155px;width:130px;padding:5px}
.dropRight .poster-info{white-space:normal;padding-right:10px;display:none;width:380px}
.dropRight:hover .poster-info{display:block}
.poster-info .poster-field{border:1px dashed #DDD;border-width:1px 0;margin:5px 0;padding:5px 0}
.poster-info .poster-field p{line-height:20px;color:#999;width:180px;display:inline-block}
.poster-info .poster-field p.status{font-style:italic;width:100%;color:#0085FF}
.poster-info .poster-field p.status .label{font-weight:700}
.poster-connect{display:inline-block;width:27px;height:16px;background:url(http://i48.servimg.com/u/f48/16/58/89/73/icon_u11.gif) no-repeat transparent}
.poster-connect img{background:#fff}
.poster-rank{float:right;margin-top:-7px}
.poster-link a{padding-right:13px}
.dropRight:hover .poster-info .poster-link{transition-delay:1s;transition:all 0.5s ease; opacity:1;}
.dropRight .poster-info .poster-link{transition:0s; opacity:0;}
.vifuser:hover {box-shadow: -1px 0px 0px #09F}
.vifuser{background:#d7d7d7}
.infovifus{background:#fafafa;width:100%;transition:all 0.5s ease;position:relative}
.xempet:focus + .infovifus{background:#fafafa;width:calc(100% - 150px);margin-left:150px;box-shadow:5px 0px 0px #ededed}
.xempet:focus + .infovifus:hover{background:#fafafa;width:calc(100% - 150px);margin-left:150px;box-shadow:5px 0px 0px #ededed}
.xempet:focus + .infovifus:active{background:#fafafa;width:calc(100% - 150px);margin-left:150px;box-shadow:5px 0px 0px #ededed}
.xempet:focus + .infovifus:focus{background:#fafafa;width:calc(100% - 150px);margin-left:150px;box-shadow:5px 0px 0px #ededed}
.xempet {outline:none;margin-top: 30px;z-index: 999;border-bottom: 0px!important;-webkit-transform: rotate(270deg);-moz-transform: rotate(270deg);-o-transform: rotate(270deg);transform: rotate(270deg);margin-left: -39px;background: #42a5de;border: 1px solid #008FE2;box-shadow: 0px 0px 0px #000 !important;position: absolute;color: #fff;font-weight: bold;line-height: 20px;}
.petvif {float:left;margin-left: 10px;margin-top: -30px;padding-top: 0px;position: absolute;}
/*VietHoa Button*/.profile_left a{color:#000 !important;font-weight:bold;margin-right:10px}
.paged-head .posting a,.paged-foot .posting a{color:#fff!important;font-weight:bold;margin-right:10px}
.paged-head .options a img,.main-foot .options a img{width:1px;height:1px}
.paged-head .options a,.main-foot .options a{color:#fff!important;font-weight:bold}
.paged-head .posting a img,.paged-foot .posting a img{width:1px;height:1px}
.profile_left img{width:1px;height:1px}
a[href*="mode=quote"],a[href*="mode=editpost"],a[href*="&mode=delete"],a[href*="mode=report"],a[href*="mode=lock&p"],a[href*="modcp?mode=ip&p"]{padding:10px 10px;line-height:23px;background:rgba(0,0,0,.5);font-weight:bold;transition:all 0.2s ease}
a[href*="mode=quote"]:before,a[href*="mode=editpost"]:before,a[href*="&mode=delete"]:before,a[href*="mode=report"]:before,a[href*="mode=lock&p"]:before,a[href*="modcp?mode=ip&p"]:before{color:#fff}
a[href*="mode=quote"]:hover,a[href*="mode=editpost"]:hover,a[href*="&mode=delete"]:hover,a[href*="mode=report"]:hover,a[href*="mode=lock&p"]:hover,a[href*="modcp?mode=ip&p"]:hover{background:rgba(0,0,0,.7)}
a[href*="mode=quote"]:before{content:"» Trích dẫn"}
a[href*="mode=editpost"]:before{content:"∞ Sửa"}
a[href*="&mode=delete"]:before{content:"◘ Xóa"}
a[href*="mode=report"]:before{content:"δ Báo xấu"}
a[href*="mode=lock&p"]:before{content:"Θ Chặn"}
a[href*="modcp?mode=ip&p"]:before{content:"φ Xem IP"}
a[href*="mode=unlock&p"]:before{content:"✓ Cho phép báo xấu"}
a[href*="cp?mode=delete"]:before{content:"✘ Xóa chủ đề"}
a[href*="cp?mode=trash"]:before{content:"⌧ Cho vào sọt"}
a[href*="cp?mode=move"]:before{content:"✄ Di chuyển"}
a[href*="cp?mode=lock"]:before{content:"✇ Khóa chủ đề"}
a[href*="cp?mode=split"]:before{content:"✂ Tách bài viết"}
a[href*="merge?t="]:before{content:"✁ Gộp bài viết"}
a[href*="cp?mode=unlock"]:before{content:"☑ Mở khóa chủ đề"}
a[href*="mode=post_profile"]:after{content:"✍ Viết lên tường"}
a[href*="mode=newtopic"]:before{content:"✑ Tạo chủ đề mới"}
a[href*="mode=reply"]:before{content:"✏ Trả lời chủ đề"}
.paged-head .posting a:nth-of-type(1),.paged-foot .posting a:nth-of-type(1){background:rgba(113,151,80,0.7);padding:15px;border-radius:5px}
.paged-head .posting a:nth-of-type(1):hover,.paged-foot .posting a:nth-of-type(1):hover{background:rgba(113,151,80,1)}
.paged-head .posting a:nth-of-type(2),.paged-foot .posting a:nth-of-type(2){background:rgba(61,142,227,0.7);padding:15px;border-radius:5px}
.paged-head .posting a:nth-of-type(2):hover,.paged-foot .posting a:nth-of-type(2):hover{background:rgba(61,142,227,1)}
.paged-head,.paged-foot{padding:20px!important;background:none!important;border:none!important}
#post_mq1_1,.i_icon_quote,.i_icon_edit,.i_icon_delete,.i_icon_ip{display:none}

Code:

<fieldset style="width:120px; height:120px; background: url(LINK BACKGROUND) no-repeat bottom; background-size:120px;border:1px solid #969696;"><legend><font color="#969696" ><div style="margin-left:5px">PET NAME</div></legend><img src="PET LINK"/></fieldset>

thanh2014 wrote:có dạng dọc hok vậy thớt o.O

NCat wrote:Đầu tiên mở trang quan lý của Admin ra, mở Modules --> Roleplay Game
--> Fields Management --> Roleplay Game --> Display the character sheet: chọn Có
--> Fields Management --> Fields --> Add a field --> Điền thông tin vào và chọn Add a field
--> Generate the sheets --> Bao nhiêu click hết
--> Character sheets --> mem muốn thêm pet --> Thêm cái đoạn bonus ở trên, tùy biến gì cũng được