AccueilFAQRechercherMembresGroupesS'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.


    QEEL Littéraire (positionnement manuel)

    Partagez
    avatar
    Halloween
    FémininAge : 24Messages : 9752

    le Sam 19 Juil 2014 - 14:12

    Rappel du premier message :

    Plop,

    Un nouveau LS basé sur une demande de Percylove.

    Comme toujours, un merci donne accès aux codes, ça fait toujours plaisir et ça prend pas 20 minutes de vos vies =3

    /!\ Je rappelle que cette section existe en cas de problème, je ne réponds pas aux MP (et encore moins quand ils sont rageux !).



    Qui est en ligne ?


    HTML & CSS ▬ Les éléments sont dans des divisions placées manuellement ▬ La PA est ici.
    Aperçu ▬ www



    CSS
    Code:
        /* -------------------------------- QEEL -------------------------------- */

        /* Positionnement du bloc des statistiques */
        .stats_qeel {
          position: absolute;
          top: 13em;
          left: 3em;
          width: 180px;
          height: 180px;
          overflow: auto;
          font-family: times new roman;
          font-size: 11px;
          text-align: justify;
        }

        /* Positionnement du bloc des plumes passagères */
        .plumes_passagères {
          position: absolute;
          top: 8.5em;
          left: 30em;
          width: 280px;
          height: 50px;
          overflow: auto;
          font-family: times new roman;
          font-size: 11px;
          text-align: justify;
        }

        /* Transparence des anniversaires et des dernières 24h */
        #kaboum .row1 {
          background-color : transparent;
        }

        /* Positionnement du bloc des plumes fêtées */
        .plumes_fetees {
          position: absolute;
          top: 8em;
          left: 56em;
          width: 170px;
          height: 80px;
          overflow: auto;
          font-family: times new roman;
          font-size: 11px;
          text-align: justify;
        }

        /* Positionnement du bloc des crédits */
        .crédits_qeel {
          position: absolute;
          top: 37em;
          left: 4em;
          width: 230px;
          height: 35px;
          overflow: auto;
          font-family: times new roman;
          font-size: 11px;
          text-align: justify;
        }

        /* Mise en forme des liens des crédits */
        .crédits_qeel a {
          color: #20040D !important;
          font-size: 11px !important;
          text-transform: uppercase !important;
          letter-spacing: 1px;
          text-decoration: none !important;
        }

        /* Mise en forme des liens des crédits au survol */
        .crédits_qeel a:hover {
          color: #856570 !important;
          text-decoration: none !important;
        }

        /* Positionnement du bloc des plumes présentes */
        .plumes_presentes {
          position: absolute;
          top: 20em;
          left: 27em;
          width: 270px;
          height: 143px;
          overflow: auto;
          font-family: times new roman;
          font-size: 11px;
          text-align: justify;
          transform: rotate(-5deg);
        }

        /* Mise en forme des liens des plumes présentes */
        .plumes_presentes a {
          text-decoration: none !important;
        }

        /* Positionnement du bloc des groupes */
        .groupes_qeel {
          position: absolute;
          top: 25em;
          left: 59.5em;
          width: 100px;
          font-family: times new roman;
          font-size: 11px;
          text-align: center;
        }

        /* Mise en forme des liens des groupes */
        .groupes_qeel a{
          text-transform: uppercase !important;
          letter-spacing: 3px;
          text-decoration: none !important;
        }

        /* -------------------------------- FIN QEEL -------------------------------- */


    Dans le template index_body, remplacer ceci :
    Code:
        <!-- BEGIN disable_viewonline -->
        <table class="forumline" width="100%" border="0" cellspacing="1" cellpadding="0">
          <tr>
              <td class="catHead" colspan="2" height="28">
              <!-- BEGIN switch_viewonline_link -->
              <span class="cattitle"><a class="cattitle" href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a></span>
              <!-- END switch_viewonline_link -->

              <!-- BEGIN switch_viewonline_nolink -->
              <span class="cattitle">{L_WHO_IS_ONLINE}</span>
              <!-- END switch_viewonline_nolink -->
              </td>
          </tr>
          <tr>
              <td class="row1" rowspan="6" align="center" valign="middle"><img src="{L_ONLINE_IMG}" id="i_whosonline" alt="{L_WHO_IS_ONLINE}" /></td>
              <td class="row1" width="100%"><span class="gensmall">{TOTAL_POSTS}<br />
              {TOTAL_USERS}<br />
              {NEWEST_USER}</span></td>
          </tr>
          <tr>
              <td class="row1"><span class="gensmall">{TOTAL_USERS_ONLINE}<br />
              {RECORD_USERS}<br />
              <br />
              {LOGGED_IN_USER_LIST}</span></td>
          </tr>
          {L_CONNECTED_MEMBERS}
          {L_WHOSBIRTHDAY_TODAY}
          {L_WHOSBIRTHDAY_WEEK}
          <tr>
              <td class="row1"><span class="gensmall">{LEGEND} : {GROUP_LEGEND}</span></td>
          </tr>
          <!-- BEGIN switch_chatbox_activate -->
          <tr>
              <td class="row1">
                <span class="gensmall">{TOTAL_CHATTERS_ONLINE} :&nbsp; {CHATTERS_LIST}<br />
                    <!-- BEGIN switch_chatbox_popup -->
                    <div id="chatbox_popup"></div>
                    <script type="text/javascript">
                    //<![CDATA[
                    insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
                    //]]>
                    </script>
                    <!-- END switch_chatbox_popup -->
                </span>
              </td>
          </tr>
          <!-- END switch_chatbox_activate -->
        </table>
        <!-- END disable_viewonline -->

    Par cela :
    Code:
        <!-- BEGIN disable_viewonline --><div style="position: relative; background-image: url('http://nsa34.casimages.com/img/2014/07/15/140715095157647502.png'); width: 810px; height: 460px;">
        <div class="stats_qeel">{TOTAL_POSTS}. {TOTAL_USERS}. {NEWEST_USER}. <br /><br />
        {TOTAL_USERS_ONLINE}</div>

        <div class="plumes_passagères"><table id="kaboum">{L_CONNECTED_MEMBERS}</table></div>
        <div class="plumes_fetees"><table id="kaboum">{L_WHOSBIRTHDAY_TODAY}
          {L_WHOSBIRTHDAY_WEEK}</table></div>

        <div class="crédits_qeel">PA et QEEL par Halloween sur <a href="http://www.never-utopia.com">Never Utopia</a>. Forte inter in huic artes alia facultas quis neque ad artes huic quaedam commune quidem cognatione facultas cognatione a se facultas quadam aut quae cognatione fuimus cognatione habent penitus ad penitus quae artes commune in dicendi quis uni ratio dicendi hoc hoc quasi nos quadam ratio ratio quaedam ingeni ne quod dediti dicendi dediti ingeni sit hoc quaedam ita commune se omnes studio Etenim huic habent quis studio ingeni disciplina quadam penitus uni commune nobis nos quaedam nos artes studio quadam et miretur ingeni nos quidem dediti ad quae quae penitus artes ratio dici neque quadam quadam dicendi nos hoc.</div>

        <div class="plumes_presentes">{LOGGED_IN_USER_LIST}</div>

        <div class="groupes_qeel"><a href="http://plume-artistique.forumactif.org/f26-plume-de-rossignol" style="color: #D80543!important;">Rossignol</a><br /><br />
        <a href="http://plume-artistique.forumactif.org/f21-plume-de-becasseau" style="color: #8A6D4B!important;">Bécasseau</a><br /><br />
        <a href="http://plume-artistique.forumactif.org/f22-plume-d-oie" style="color: #EA792A!important;">Oie</a><br /><br />
        <a href="http://plume-artistique.forumactif.org/f23-plume-d-hirondelle" style="color: #8373AB!important;">Hirondelle</a><br /><br />
        <a href="http://plume-artistique.forumactif.org/f24-plume-de-chevalier" style="color: #5B181A!important;">Chevalier</a><br /><br />
          <a href="http://plume-artistique.forumactif.org/f25-plume-d-hibou" style="color: #2C0F96!important;">Hibou</a></div></div>
        <!-- END disable_viewonline -->

    Pensez à activer l'affichage des membres connectés ces 24h dernières heures pour qu'il apparaisse (affichage → généralités).






    Mettre un crédit vers Never-Utopia est obligatoire. Retirer un crédit est interdit.
    Si vous avez des problèmes avec ce LS, venez poster ici.
    Merci de laisser un message pour donner vos impressions, commentaires et/ou remerciements ^^




    < / Libre service codage >
    avatar
    Krager
    MasculinAge : 23Messages : 40

    le Jeu 13 Aoû 2015 - 5:23

    Merci
    avatar
    Kimberlay *
    FémininAge : 28Messages : 160

    le Lun 24 Aoû 2015 - 16:56

    Merci
    avatar
    BlueBerry ♪
    FémininAge : 20Messages : 138

    le Jeu 15 Oct 2015 - 13:18

    très joli merci !



    avatar
    Lamire
    FémininAge : 24Messages : 94

    le Lun 2 Nov 2015 - 1:43

    Merci beaucoup ~
    avatar
    Yttel
    MasculinAge : 35Messages : 29

    le Mer 4 Nov 2015 - 11:29

    Merci
    avatar
    SvenO
    MasculinAge : 24Messages : 78

    le Jeu 5 Nov 2015 - 14:20

    Merci Halloween !



    avatar
    Samluna
    FémininAge : 19Messages : 96

    le Mer 18 Nov 2015 - 16:49

    Roh my god :O C'est tellement beau que ç'en devient irréel *Q* J'adore teeeeellement ! x3 Merci beaucouuuup Very Happy




    Priez pour Paris. Priez pour la liberté.
    Priez pour Paris. Priez pour l'égalité.
    Priez pour Paris. Pour la fraternité.

    #Pray for Paris
    avatar
    Sly King
    FémininAge : 21Messages : 75

    le Dim 6 Déc 2015 - 13:51

    C'est vraiment sympa comme QEEL, merci du partage ! ♥
    avatar
    Liraco
    FémininAge : 21Messages : 21

    le Ven 11 Déc 2015 - 13:24

    Très beau qeel merci !
    avatar
    Kiki*
    FémininAge : 21Messages : 32

    le Lun 14 Déc 2015 - 20:29

    Merci !
    avatar
    Miss lili
    FémininAge : 27Messages : 49

    le Mar 29 Déc 2015 - 19:00

    merci tres beau rendu
    avatar
    Chadot
    FémininAge : 29Messages : 176

    le Ven 1 Jan 2016 - 19:19

    Merci



    avatar
    Invité

    le Sam 9 Jan 2016 - 16:45

    J'adore, merci beaucoup :love:
    avatar
    Blueflyght
    FémininAge : 17Messages : 22

    le Dim 10 Jan 2016 - 16:28

    Merci =)
    avatar
    Kitty Kat.
    FémininAge : 24Messages : 86

    le Ven 15 Jan 2016 - 0:07

    J'aime beaucoup !! Very Happy
    avatar
    satine-chan
    FémininAge : 30Messages : 31

    le Dim 17 Jan 2016 - 14:07

    Merci beaucoup pour ce partage <3
    avatar
    Ombinou
    FémininAge : 23Messages : 133

    le Dim 24 Jan 2016 - 15:43

    Merci beaucoup pour cette superbe QEEL
    avatar
    fraumali
    FémininAge : 38Messages : 121

    le Dim 24 Jan 2016 - 20:37

    Bonjour et merci de ce partage:D
    avatar
    Lie_MADcircus
    MasculinAge : 25Messages : 36

    le Lun 25 Jan 2016 - 23:12

    Merci.
    avatar
    Kobye
    FémininAge : 21Messages : 37

    le Dim 31 Jan 2016 - 14:51

    merci!
    avatar
    Brume Sauvage
    FémininAge : 25Messages : 35

    le Lun 1 Fév 2016 - 12:46

    c'est jolie **
    Merci Very Happy
    avatar
    Kianda
    MasculinAge : 17Messages : 88

    le Dim 7 Fév 2016 - 16:49

    Magnifique merci :)



    avatar
    OMJ
    FémininAge : 27Messages : 91

    le Dim 14 Fév 2016 - 16:42

    j'adoreee :)
    avatar
    Eywa
    FémininAge : 33Messages : 14

    le Sam 27 Fév 2016 - 15:07

    c'est vraiment très beau j'adore
    avatar
    Kazumi
    FémininAge : 17Messages : 45

    le Mar 5 Avr 2016 - 19:52

    Merci !
    Contenu sponsorisé


      La date/heure actuelle est Mar 19 Juin 2018 - 0:36