AccueilDernières imagesRechercherS'enregistrerConnexion

Forum de graphisme, codage et game design proposant des tutoriels, astuces, libres services et commandes dans les domaines de l'infographie amateur, de l'intégration web (HTML et CSS essentiellement) ainsi que dans la conception de RPG sur forum.

Le Deal du moment : -25%
PC Portable Gamer 16,1” HP Victus 16 – 16 ...
Voir le deal
749.99 €

    [Template & CSS] Organisation des Messages

    Taktiik
    Taktiik
    MasculinAge : 30Messages : 2292

    Dim 27 Nov 2011 - 2:22

    Rappel du premier message :

    Organisation des Messages Dernière mise à jour : 24 Novembre 2012
    Aperçu
    		Préparation
    		Détails


    W W W

    I M A G E
    Afin d'avoir un affichage optimisé et exactement sur l'exemple précédent, voici les réglages à faire dans votre Panneau d'administration.

    ? Activez les fiches personnages des membres dans Modules>Fiches de personnage

    Ceci fait, vous pouvez maintenant poursuivre et débuter l'astuce. Pour toutes questions, n'hésitez pas à m'envoyer un email : taktiik69@gmail.com si j'oublie de répondre, et j'insiste à nouveau :

    Sparrow Style a dit : Quoi qu'il en soit, si vous utilisez ce tutoriel pour personnaliser l'apparence de votre forum, je vous demande de mettre un crédit à Never-Utopia sur votre accueil, de manière lisible cela va de soi, en guise de remerciement pour l'aide que nous vous avons apportée.


    Niveau : Moyen
    Fait : 27/11/2011
    Type : Astuce


    V
    oici une astuce dans laquelle je vous donne une construction des messages tout faîte. Mais ... C'est quoi ?
    Ici, vous allez pouvoir avoir une organisation des messages qui se démarque des autres. En effet, j'ai pris de mon temps pour vous concocter un truc bien sympa et qui met bien en valeur les messages. C'est d'ailleurs à la base, fait pour les forums RPG =). Bien entendu, la seule chose que je vous demande, c'est de mettre un crédit qui redirige ici, vers Never Utopia, en guise de remerciement.

    Le contenu n'est pas sous balide hide (explications), mais n'hésitez pas à remercier son auteur.


    Navigation




    Partie Template


    Vous devez donc remplacer votre template Viewtopic_body par celui-ci :

    Code:
    <script type="text/javascript">
    //<![CDATA[
    var multiquote_img_off = '{JS_MULTIQUOTE_IMG_OFF}', multiquote_img_on = '{JS_MULTIQUOTE_IMG_ON}', _atr = '{JS_DIR}addthis/', _ati = '{PATH_IMG_FA}addthis/'{ADDTHIS_LANG}, addthis_localize = { share_caption: "{L_SHARE_CAPTION}", email: "{L_EMAIL}", email_caption: "{L_EMAIL_CAPTION}", favorites: "{L_SHARE_BOOKMARKS}", print: "{L_PRINT}", more: "{L_MORE}" };
    $(function(){
     _atc.cwait = 0;
     $('.addthis_button').mouseup(function(){
     if ($('#at15s').css('display') == 'block') {
     addthis_close();
     addthis_close();
     }
     });
    });
    //]]>
    </script>

    <table width="100%" border="0" cellspacing="2" cellpadding="0">
     <tr>
     <td align="left" valign="middle" nowrap="nowrap">
     <span class="nav">
     <!-- BEGIN switch_user_authpost -->
     <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" id="{POST_IMG_ID}one" alt="{L_POST_NEW_TOPIC}" align="middle" border="0" /></a>   
     <!-- END switch_user_authpost -->
     <!-- BEGIN switch_user_authreply -->
     <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" id="i_reply" alt="{L_POST_REPLY_TOPIC}" align="middle" border="0" /></a>
     <!-- END switch_user_authreply -->
     </span>
     </td>
     <td align="left" valign="middle" nowrap="nowrap">
     <!-- BEGIN switch_twitter_btn -->
     <span id="twitter_btn" style="margin-left: 6px; ">
     <a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal">Tweet</a>
     <script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
     </span>
     <!-- END switch_twitter_btn -->
     <!-- BEGIN switch_fb_likebtn -->
     <span id="fb_likebtn" style="margin-left: 6px; ">
     <iframe src="http://www.facebook.com/plugins/like.php?href={FORUM_URL}{TOPIC_URL}&layout=button_count&show_faces=false&width=100&action=like&colorscheme=light&height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:100px; height:21px;" allowTransparency="true"></iframe>
     </span>
     <!-- END switch_fb_likebtn -->
     </td>
     <td class="nav" valign="middle" width="100%"><span class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_SEP}<a class="nav" href="{U_ALBUM}">{L_ALBUM}</a>{NAV_CAT_DESC_SECOND}</span></td>
     <td align="right" valign="bottom" nowrap="nowrap" width="100%">
     <span class="gensmall bold">
     <a class="addthis_button" href="http://www.addthis.com/bookmark.php?v=250&pub=forumotion">{L_SHARE}</a>
      | 
     <script type="text/javascript">//<![CDATA[
     var url_favourite = '{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('f{FORUM_ID}&t={TOPIC_ID}','{JS_SESSION_ID}', {JS_AUTH_FAVOURITES});
     //]]>
     </script>
     </span>
     </td>
     </tr>
    </table>

    <table align="center" class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">

     <!-- BEGIN topicpagination -->
     <tr>
     <td class="row1 pagination" colspan="2" align="right" valign="top"><span class="gensmall">{PAGINATION}</span></td>
     </tr>
     <!-- END topicpagination -->
     {POLL_DISPLAY}
     <!-- BEGIN postrow -->
     <!-- BEGIN displayed -->
     <tr class="post">
     <td class="{postrow.displayed.ROW_CLASS}"{postrow.displayed.THANK_BGCOLOR} valign="top" width="100%" height="28" colspan="2">
     <table width="100%" border="0" cellspacing="0" cellpadding="0">
     <tr>
     <td colspan="2">
     <!-- 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 -->
     </td>
     <!--  Modification_Taktiik_NeverUtopia -->
     <td colspan="2">
     <center>
     <div class="optionsmodo">
     {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>
     </center>
                  
    <center><div class="profil">
      <table width="100%" align="center">
     <tr>
     <td align="center" width="30%">
     <div class="boitegauche">
     <span class="name"><a name="{postrow.displayed.U_POST_ID}"></a><strong>{postrow.displayed.POSTER_NAME}</strong></span>


     <span class="postdetails poster-profile">
     {postrow.displayed.POSTER_RANK}


     {postrow.displayed.RANK_IMAGE}


                    {postrow.displayed.POSTER_AVATAR}


     </span>
     <span class="postdetails poster-profile">
                                      <div class="profilmasque"><div class="titreprofil">Afficher Infos</div>
     <!-- BEGIN profile_field -->
     {postrow.displayed.profile_field.LABEL} {postrow.displayed.profile_field.CONTENT}{postrow.displayed.profile_field.SEPARATOR}
     <!-- END profile_field -->
     {postrow.displayed.POSTER_RPG}
                </div>
     </span>
                                   </div>
     </td>
     
                       <td align="center" width="30%" >
                          {postrow.displayed.SIGNATURE}
     </td>
     </tr>
     
    <tr>
                        <td align="center" colspan="2" style="text-align: center;" width="100%" >
     <div class="infoss"><center><span class="postdetails">
     <img src="{postrow.displayed.MINI_POST_IMG}" alt="{postrow.displayed.L_MINI_POST_ALT}" title="{postrow.displayed.L_MINI_POST_ALT}" border="0" />{TOPIC_TITLE}

    <img src="{postrow.displayed.MINI_TIME_IMG}" alt="{postrow.displayed.L_MINI_TIME_ALT}" title="{postrow.displayed.L_MINI_TIME_ALT}" border="0" />{postrow.displayed.POST_DATE}
     </span></center>
                            </div>
     </td>
     </tr>
     
    <tr>
                        <td colspan="2" align="center" width="80%" >
     <div class="postbody">
     <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>
     </td>
     </tr>
      </table>
     <img src="http://2img.net/i/fa/empty.gif" alt="" style="width:150px;height:1px" />
     </div></center>
     
    <center><div class="ssoptions">
     <span class="postdetails">
     {postrow.displayed.PROFILE_IMG} {postrow.displayed.PM_IMG} {postrow.displayed.EMAIL_IMG}{postrow.displayed.contact_field.CONTENT} {postrow.displayed.ONLINE_IMG}
     </span>
     </div></center>


     </td>
     <!-- Modification_Taktiik_NeverUtopia -->
     </tr>
     </table>
     </td>
     </tr>
     <!-- BEGIN first_post_br -->
    </table>


    <table align="center" class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
     <tr>
     <th class="thLeft" nowrap="nowrap" width="150px" height="26">{L_AUTHOR}</th>
     <th class="thRight" nowrap="nowrap" colspan="2">{L_MESSAGE}</th>
     </tr>
     <!-- END first_post_br -->
     <!-- END displayed -->
     <!-- BEGIN hidden -->
     <tr>
     <td class="postdetails {postrow.hidden.ROW_CLASS}" colspan="2" align="center">{postrow.hidden.MESSAGE}</td>
     </tr>
     <!-- END hidden -->
     <!-- END postrow -->
     <!-- BEGIN no_post -->
     <tr align="center">
     <td class="row1" colspan="3" height="28">
     <span class="genmed">{no_post.L_NO_POST}</span>
     </td>
     </tr>
     <!-- END no_post -->
    </table>

    <!-- BEGIN promot_trafic -->
    <table align="center" class="forumline" width="100%" border="0" cellpadding="1" cellspacing="0" id="ptrafic_close" style="display:none;margin: 1px 0px 1px 0px">
     <tr>
     <td class="catBottom" height="28">
     <table width="100%" border="0" cellspacing="0" cellpadding="0">
     <tr>
     <td valign="top"><h1 class="cattitle"> {PROMOT_TRAFIC_TITLE}</h1></td>
     <td align="right" valign="middle" width="10"><span class="gensmall"><a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><img src="{TABS_MORE_IMG}" alt="+" align="middle" border="0" /></a></span></td>
     </tr>
     </table>
     </td>
     </tr>
    </table>

    <table align="center" class="forumline" width="100%" border="0" cellpadding="1" cellspacing="0" id="ptrafic_open" style="display:'';margin: 1px 0px 1px 0px">
     <tr>
     <td class="catBottom" height="28">
     <table width="100%" border="0" cellspacing="0" cellpadding="0">
     <tr>
     <td valign="top"><h1 class="cattitle"> {PROMOT_TRAFIC_TITLE}</h1></td>
     <td align="right" valign="middle" width="10"><span class="gensmall"><a href="javascript:ShowHideLayer('ptrafic_open','ptrafic_close');"><img src="{TABS_LESS_IMG}" alt="-" align="middle" border="0" /></a></span></td>
     </tr>
     </table>
     </td>
     </tr>
     <tr>
     <td class="row2 postbody" valign="top">
     <!-- BEGIN link -->
     » <a style="text-decoration:none" href="{promot_trafic.link.U_HREF}" target="_blank" title="{promot_trafic.link.TITLE}">{promot_trafic.link.TITLE}</a>

     <!-- END link -->
     </td>
     </tr>
    </table>
    <!-- END promot_trafic -->

    <table align="center" class="forumline noprint" width="100%" border="0" cellspacing="0" cellpadding="0">
     <tr>
     <td class="row2" valign="top" {COLSPAN_PAGINATION} width="150"><span class="gensmall">{PAGE_NUMBER}</span></td>
     <!-- BEGIN topicpagination -->
     <td class="row1" align="right" valign="top" ><span class="gensmall">{PAGINATION}</span></td>
     <!-- END topicpagination -->
     </tr>
     <!-- BEGIN switch_user_logged_in -->
     <!-- BEGIN watchtopic -->
     <tr>
     <td class="row2" colspan="2" align="right" valign="top"><span class="gensmall">{S_WATCH_TOPIC}</span></td>
     </tr>
     <!-- END watchtopic -->
     <!-- END switch_user_logged_in -->
     <tr>
     <td class="row2" colspan="2" align="center" style="padding:0px">
     <!-- BEGIN switch_user_logged_in -->
     <a name="quickreply"></a>
     {QUICK_REPLY_FORM}

     <!-- END switch_user_logged_in -->
     </td>
     </tr>
     <tr>
     <td style="margin:0; padding: 0;" colspan="2">
     <table border="0" cellpadding="0" width="100%" cellspacing="0" id="info_open" style="display:''">
     <tbody>
     <!-- BEGIN show_permissions -->
     <tr>
     <td class="row2" valign="top" width="25%"><span class="gensmall">{L_TABS_PERMISSIONS}</span></td>
     <td class="row1" valign="top" width="75%"><span class="gensmall">{S_AUTH_LIST}</span></td>
     </tr>
     <!-- END show_permissions -->
     <tr>
     <td class="catBottom" colspan="2" height="28">
     <table width="100%" border="0" cellspacing="0" cellpadding="0">
     <tr>
     <td valign="middle" width="100%"><span class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_SEP}<a class="nav" href="{U_ALBUM}">{L_ALBUM}</a>{NAV_CAT_DESC_SECOND}</span></td>
     <!-- BEGIN show_permissions -->
     <td align="right" valign="middle"><span class="gensmall"><a href="javascript:ShowHideLayer('info_open','info_close');"><img src="{TABS_LESS_IMG}" alt="-" align="middle" border="0" /></a></span></td>
     <!-- END show_permissions -->
     </tr>
     </table>
     </td>
     </tr>
     </tbody>
     </table>
     </td>
     </tr>
     <tr>
     <td style="margin:0; padding: 0;" colspan="2">
     <table border="0" cellpadding="0" cellspacing="0" width="100%" id="info_close" style="display:none;">
     <tbody>
     <tr>
     <td class="catBottom" colspan="2" height="28">
     <table width="100%" border="0" cellspacing="0" cellpadding="0">
     <tr>
     <td valign="middle" width="100%"><span class="nav"><a class="nav" href="{U_INDEX}">{L_INDEX}</a>{NAV_SEP}<a class="nav" href="{U_ALBUM}">{L_ALBUM}</a>{NAV_CAT_DESC_SECOND}</span></td>
     <td align="right" valign="middle"><span class="gensmall"><a href="javascript:ShowHideLayer('info_open','info_close');"><img src="{TABS_MORE_IMG}" alt="+" align="middle" border="0" /></a></span></td>
     </tr>
     </table>
     </td>
     </tr>
     </tbody>
     </table>
     </td>
     </tr>
    </table>

    <form action="{S_JUMPBOX_ACTION}" method="get" name="jumpbox" onsubmit="if(document.jumpbox.f.value == -1){return false;}">
    <table class="noprint" width="100%" border="0" cellspacing="2" cellpadding="0" align="center">
     <tr>
     <td align="left" valign="middle" nowrap="nowrap" {WIDTH_GALLERY}>
     <span class="nav">
     <!-- BEGIN switch_user_authpost -->
     <a href="{U_POST_NEW_TOPIC}" rel="nofollow"><img src="{POST_IMG}" id="{POST_IMG_ID}Newtopic" alt="{L_POST_NEW_TOPIC}" align="middle" border="0" /></a>   
     <!-- END switch_user_authpost -->
     <!-- BEGIN switch_user_authreply -->
     <a href="{U_POST_REPLY_TOPIC}"><img src="{REPLY_IMG}" alt="{L_POST_REPLY_TOPIC}" align="middle" border="0" /></a>
     <!-- END switch_user_authreply -->
     </span>
     </td>

     <!-- BEGIN viewtopic_bottom -->
     <td align="right" nowrap="nowrap"><span class="gensmall">{L_JUMP_TO}: {S_JUMPBOX_SELECT} <input class="liteoption" type="submit" value="{L_GO}" /></span></td>
     <!-- END viewtopic_bottom -->

     <!-- BEGIN moderation_panel -->
     <td align="center">
     <span class="gensmall">{moderation_panel.U_YOUR_PERSONAL_MODERATE}</span>
     </td>
     <td align="center" width="250">
     <span class="gensmall"> </span>
     </td>
     <!-- END moderation_panel -->
     </tr>
    </table>
    </form>

    <!-- BEGIN viewtopic_bottom -->
    <table class="noprint" width="100%" border="0" cellspacing="2" cellpadding="0" align="center">
     <tr>
     <td colspan="2" align="left" valign="top" nowrap="nowrap">
    {S_TOPIC_ADMIN}

     <form name="action" method="get" action="{S_FORM_MOD_ACTION}">
     <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}" />

     <span class="gen">{L_MOD_TOOLS}
    {S_SELECT_MOD}&nbsp;<input class="liteoption" type="submit" value="{L_GO}" /></span>
     </form>
     </td>
     </tr>
    </table>
    <!-- END viewtopic_bottom -->

    <!-- BEGIN switch_image_resize -->
    <script type="text/javascript">
    //<![CDATA[
    $(resize_images({ 'selector' : '.postbody', 'max_width' : {switch_image_resize.IMG_RESIZE_WIDTH}, 'max_height' : {switch_image_resize.IMG_RESIZE_HEIGHT} }));
    //]]>
    </script>
    <!-- END switch_image_resize -->
    <script src="{JS_DIR}addthis/addthis_widget.js" type="text/javascript"></script>
    Publiez votre template et dirigez-vous vers votre Feuille de style CSS =)!

    Partie CSS


    Maintenant, Ajoutez ce CSS au votre :

    Code:

     /* MESSAGES NU */

    .profil
    {
      width: 90%; /* Ne pas toucher */
      padding: 0px;
      padding-top: 10px;
      padding-bottom: 10px; /* Ne pas toucher */
      -moz-box-shadow: inset 1px 1px 10px #000000;
      -webkit-box-shadow: inset 1px 1px 10px #000000;
      box-shadow: inset 1px 1px 10px #000000;
      -o-box-shadow: inset 1px 1px 10px #000000;
      -htm-box-shadow: inset 1px 1px 10px #000000;
      background-color: #a38e71;
      border: 2px solid #8f8466;
      border-radius: 50px;
      -moz-border-radius: 50px;
      -o-border-radius: 50px;
      -htm-border-radius: 50px;
      -webkit-border-radius: 50px;
    }

    .optionsmodo
    {
      width: 60%; /* Ne pas toucher */
      background-color: #a38e71;
      border: 2px solid #8f8466;
      -moz-box-shadow: 1px 1px 10px #000000;
      -webkit-box-shadow: 1px 1px 10px #000000;
      box-shadow: 1px 1px 10px #000000;
      -o-box-shadow: 1px 1px 10px #000000;
      -htm-box-shadow: 1px 1px 10px #000000;
      border-radius: 30px 30px 0px 0px;
      -moz-border-radius: 30px 30px 0px 0px;
      -o-border-radius: 30px 30px 0px 0px;
      -htm-border-radius: 30px 30px 0px 0px;
      -webkit-border-radius: 30px 30px 0px 0px;
    }

    .boitegauche
    {
      float: left; /* Ne pas toucher */
      border: 2px solid #8f8466;
      text-align: center; /* Ne pas toucher */
      padding-bottom: 15px;   /* Ne pas toucher */
      margin: 10px;  /* Ne pas toucher */
      -moz-box-shadow: inset 1px 1px 10px #000000;
      -webkit-box-shadow: inset 1px 1px 10px #000000;
      box-shadow: inset 1px 1px 10px #000000;
      -o-box-shadow: inset 1px 1px 10px #000000;
      -htm-box-shadow: inset 1px 1px 10px #000000;
      border-radius: 50px;
      -moz-border-radius: 50px;
      -o-border-radius: 50px;
      -htm-border-radius: 50px;
      -webkit-border-radius: 50px;
    }

    .infoss
    {
      border-top: 2px solid #8f8466;
      border-bottom: 2px solid #8f8466;
      margin: 0px; /* Ne pas toucher */
      margin-top: 10px; /* Ne pas toucher */
      margin-bottom: 10px; /* Ne pas toucher */
      -moz-box-shadow: 0px 0px 10px #000000;
      -webkit-box-shadow: 0px 0px 10px #000000;
      box-shadow: 0px 0px 10px #000000;
      -o-box-shadow: 0px 0px 10px #000000;
      -htm-box-shadow: 0px 0px 10px #000000;
    }

    .ssoptions
    {
      width: 60%; /* Ne pas toucher */
      background-color: #a38e71;
      border: 2px solid #8f8466;
      -moz-box-shadow: 1px 1px 10px #000000;
      -webkit-box-shadow: 1px 1px 10px #000000;
      box-shadow: 1px 1px 10px #000000;
      -o-box-shadow: 1px 1px 10px #000000;
      -htm-box-shadow: 1px 1px 10px #000000;
      border-radius: 0px 0px 30px 30px;
      -moz-border-radius: 0px 0px 30px 30px;
      -o-border-radius: 0px 0px 30px 30px;
      -htm-border-radius: 0px 0px 30px 30px;
      -webkit-border-radius: 0px 0px 30px 30px;
    }

      /*Profil masqué*/
    .profilmasque
    {
      transform: all; /* Ne pas toucher */
      -moz-transform: all; /* Ne pas toucher */
      -o-transform: all; /* Ne pas toucher */
      -htm-transform: all; /* Ne pas toucher */
      -webkit-transform: all; /* Ne pas toucher */
      transition: 1s; /* Ne pas toucher */
      -moz-transition: 1s; /* Ne pas toucher */
      -o-transition: 1s; /* Ne pas toucher */
      -htm-transition: 1s; /* Ne pas toucher */
      -webkit-transition: 1s; /* Ne pas toucher */
      padding: 10px; /* Ne pas toucher */
      overflow: hidden; /* Ne pas toucher */
      height: 18px; /* Entrez la valeur de font-size dans .titreprofil */
      text-align: center;
    }

    .profilmasque:hover
    {
      transform: all; /* Ne pas toucher */
      -moz-transform: all; /* Ne pas toucher */
      -o-transform: all; /* Ne pas toucher */
      -htm-transform: all; /* Ne pas toucher */
      -webkit-transform: all; /* Ne pas toucher */
      transition: 1s; /* Ne pas toucher */
      -moz-transition: 1s; /* Ne pas toucher */
      -o-transition: 1s; /* Ne pas toucher */
      -htm-transition: 1s; /* Ne pas toucher */
      -webkit-transition: 1s; /* Ne pas toucher */
      padding: 10px; /* Ne pas toucher */
      overflow: hidden; /* Ne pas toucher */
      height: 150px; /* Dépend de la quantité d'informations que vous voulez mettre, n'hésitez pas à le réduire ou l'agrandir */
    }

    .titreprofil
    {
      font-size: 23px;
      text-shadow: 1px 1px 2px #000000;
    }
    Navigation




    Voila ! Very Happy
    J'espère que cette astuce vous aidera à embellir votre forum =)
    N'hésitez pas à me contacter pour de l'aide,
    Taktiik.


    Si vous avez des problèmes avec ce LS, venez poster ici.


    Dernière édition par Taktiik le Sam 24 Nov 2012 - 16:39, édité 5 fois

    • Revenir en haut
    Mika-chan
    Mika-chan
    FémininAge : 32Messages : 76

    Sam 24 Mar 2012 - 14:31

    Merci beaucoup pour le Tuto Very Happy
    • Revenir en haut
    Jimmy
    Jimmy
    MasculinAge : 29Messages : 166

    Dim 25 Mar 2012 - 14:50

    Veux voir ! :)
    • Revenir en haut
    Anonymous
    Invité

    Dim 25 Mar 2012 - 14:52

    MErciiiiiiiiiiiiiiii =)
    • Revenir en haut
    warning.sign
    warning.sign
    FémininAge : 34Messages : 58

    Dim 25 Mar 2012 - 17:16

    merci =)
    • Revenir en haut
    avatar
    KanyeWest
    MasculinAge : 33Messages : 137

    Lun 26 Mar 2012 - 23:54

    Merci
    • Revenir en haut
    Rose24
    Rose24
    FémininAge : 33Messages : 24

    Mar 27 Mar 2012 - 1:27

    Merci, très beau comme résultat !!
    • Revenir en haut
    Kisuke.U
    Kisuke.U
    MasculinAge : 27Messages : 66

    Mar 27 Mar 2012 - 18:28

    Tanks you Very Happy



    [Template & CSS] Organisation des Messages - Page 5 649969Laggron2
    • Revenir en haut
    Nut'
    Nut'
    FémininAge : 24Messages : 37

    Ven 30 Mar 2012 - 18:05

    Merci (:



    C'est ballot, j'ai pas de signa' q: Juste pour vous énervé tiens !
    • Revenir en haut
    Lamia
    Lamia
    FémininAge : 29Messages : 154

    Sam 31 Mar 2012 - 13:00

    merci ;3
    • Revenir en haut
    Elphemeria
    Elphemeria
    FémininAge : 30Messages : 17

    Sam 31 Mar 2012 - 16:44

    Merci :3
    • Revenir en haut
    Swiff
    Swiff
    FémininAge : 30Messages : 24

    Lun 2 Avr 2012 - 17:28


      Merci beaucoup ! Very Happy
    • Revenir en haut
    Zillouh
    Zillouh
    FémininAge : 32Messages : 43

    Jeu 5 Avr 2012 - 20:13

    Merci !
    • Revenir en haut
    Chadot
    Chadot
    FémininAge : 36Messages : 248

    Ven 6 Avr 2012 - 10:59

    Merci pour ce tuto.
    • Revenir en haut
    Corkyie
    Corkyie
    FémininAge : 26Messages : 75

    Ven 6 Avr 2012 - 20:06

    Ça change du normal ! Merci pour tout ces codes !
    • Revenir en haut
    Destiny
    Destiny
    MasculinAge : 33Messages : 36

    Sam 14 Avr 2012 - 18:58

    Merci



    [Template & CSS] Organisation des Messages - Page 5 18zw4i
    • Revenir en haut
    blaster
    blaster
    MasculinAge : 29Messages : 32

    Mer 18 Avr 2012 - 14:45

    Merci



    [Template & CSS] Organisation des Messages - Page 5 1341563019

    Je serais Abs du 06/08 jusqu'au 26/08 , je vous prie de ne pas supprimez mes topics !!
    • Revenir en haut
    shala
    shala
    FémininAge : 32Messages : 213

    Lun 7 Mai 2012 - 1:25

    merci



    • Revenir en haut
    McIntosh
    McIntosh
    FémininAge : 35Messages : 27

    Lun 7 Mai 2012 - 9:35

    Wah génial *_* Merci beaucoup, et bravo o/
    • Revenir en haut
    24nono38
    24nono38
    FémininAge : 34Messages : 69

    Lun 7 Mai 2012 - 21:52

    Merci d'avance ^^



    [Template & CSS] Organisation des Messages - Page 5 230763kratossign1
    • Revenir en haut
    Leean
    Leean
    FémininAge : 31Messages : 19

    Lun 14 Mai 2012 - 21:27

    Merci : )
    • Revenir en haut
    TUC
    TUC
    FémininAge : 36Messages : 103

    Jeu 24 Mai 2012 - 12:14

    merciii :)



    [Template & CSS] Organisation des Messages - Page 5 Tumblr_msx9fygOsJ1qlujrso1_250 [Template & CSS] Organisation des Messages - Page 5 Tumblr_msx9fygOsJ1qlujrso2_250 [Template & CSS] Organisation des Messages - Page 5 Tumblr_msx9fygOsJ1qlujrso3_250 [Template & CSS] Organisation des Messages - Page 5 Tumblr_msx9fygOsJ1qlujrso4_250
    • Revenir en haut
    Vengryn
    Vengryn
    MasculinAge : 33Messages : 130

    Jeu 31 Mai 2012 - 13:51

    Merci bien :)
    • Revenir en haut
    Etax
    Etax
    MasculinAge : 27Messages : 168

    Dim 10 Juin 2012 - 20:32

    Merci de ce tutoriel.
    • Revenir en haut
    xodramm
    xodramm
    FémininAge : 46Messages : 286

    Dim 17 Juin 2012 - 16:52

    Je peux voir aussi ^^
    • Revenir en haut
    Miradada
    Miradada
    FémininAge : 32Messages : 14

    Lun 18 Juin 2012 - 22:13

    Merci Very Happy
    • Revenir en haut
    Contenu sponsorisé

    • Revenir en haut
    « Voir le sujet précédent · Voir le sujet suivant »
      La date/heure actuelle est Jeu 21 Nov 2024 - 20:06