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.


    Navigation en colonne, positionnement libre

    Partagez
    Okhmhaka
    FémininAge : 31Messages : 31751

    le Ven 29 Nov 2013 - 17:39

    Rappel du premier message :

    Navigation en colonne - positionnement libre


    Dans cette astuce l'objectif est de changer l'affichage de la navigation pour qu'elle ne soit plus en ligne mais en colonne, les liens affichés les uns en dessous des autres. La navigation restera cependant celle d'origine et ses liens pourront être modifiés via le panneau d’administration (ajout du calendrier, du portail, etc...). De même, les connectés auront les liens de profil et messagerie que les invités n'auront pas. Bref, vous l'avez compris, la barre barre restera identique dans son contenu que la navigation classique mais son positionnement change, les liens seront les uns en dessous des autres et le bloc qui les contiendra pourra être placé où vous le souhaitez (par défaut dans le code il sera collé au bord gauche de la page.

    Exemple de résultat (le lien "membre" étant survolé) :






    Saia
    FémininAge : 21Messages : 180

    le Lun 23 Déc 2013 - 22:45

    Merci!!!!!



    pops44
    MasculinAge : 23Messages : 28

    le Mar 24 Déc 2013 - 0:05

    Merci
    Kai Turindo
    MasculinAge : 16Messages : 80

    le Mar 24 Déc 2013 - 21:26

    MERCI. Oh mon dieu je cherchais partout. *Q*
    servity
    MasculinAge : 45Messages : 80

    le Mer 25 Déc 2013 - 1:44

    Merci pour ce tutoriel.



    Arfgang
    MasculinAge : 25Messages : 57

    le Jeu 26 Déc 2013 - 12:53

    Pile ce qu'il me fallait, merci



    Afterglow.winter
    FémininAge : 21Messages : 135

    le Jeu 26 Déc 2013 - 18:22

    Merci :)



    How do you get up from an all time low?
    shibari
    MasculinAge : 21Messages : 259

    le Sam 28 Déc 2013 - 11:48

    tks





    Merci Dakota pour ce kit.
    Henoch
    FémininAge : 34Messages : 34

    le Sam 28 Déc 2013 - 15:21

    ça à l'air sympa merci!
    Lilly31
    FémininAge : 25Messages : 97

    le Dim 29 Déc 2013 - 12:05

    Merci :)



    Pastomaniac
    FémininAge : 20Messages : 194

    le Lun 30 Déc 2013 - 0:14

    Thanks.



    Venise
    FémininAge : 33Messages : 270

    le Jeu 2 Jan 2014 - 14:22

    merci capitaine
    -Jukai.
    MasculinAge : 24Messages : 18

    le Dim 5 Jan 2014 - 12:37

    Merci du partage Wink
    N3MO
    MasculinAge : 26Messages : 36

    le Mer 8 Jan 2014 - 17:49

    merci pour le partage je continue mon fouinage Very Happy

    Par contre il y a un petit bug ici:
    Code:
    #navig a /* personnalise les liens */
    {
      display: block; /* met les liens en colonne */
      margin-bottom: -20px; /* enleve l'espacement par defaut des liens entre eux */
      background: #ffffff; /* couleur de fond des liens */
      border-bottom: 1px solid #e6e6e6; /* bordure basse des liens */
      padding: 3px 10px; /* marge interieure des liens */
      text-align: center; /* alignement du texte */
      text-transform: uppercase; /* met le texte en majuscule */
      transition: 1s; /* realise une transition lente avec l effet au survol */
      -moz-transition: 1s;
      -htm-transition: 1s;
      -o-transition: 1s;
      -webkit-transition: 1s;
    }

    Il faut enlever à la ligne margin-bottom l'apostrophe" l'espacement"
    Neymar
    MasculinAge : 18Messages : 135

    le Mer 8 Jan 2014 - 19:46

    Merci du Partage généreuse personne ~
    Toshiki
    FémininAge : 20Messages : 54

    le Jeu 9 Jan 2014 - 17:33

    merci
    Zuny
    FémininAge : 23Messages : 18

    le Ven 10 Jan 2014 - 14:37

    Merci Razz
    JasLo
    FémininAge : 14Messages : 76

    le Sam 11 Jan 2014 - 16:24

    Je cherchais un code comme celui-là!
    Souky Mitsu
    FémininAge : 26Messages : 98

    le Sam 11 Jan 2014 - 18:37

    Parfait ! C'est-ce que je cherchais héhé. Merci :)
    Shalyma
    FémininAge : 27Messages : 486

    le Sam 11 Jan 2014 - 20:26

    Merci pour ce truc ^^




    Merci Marie Chérie pour le kit!
    Amera
    FémininAge : 24Messages : 67

    le Mar 14 Jan 2014 - 18:55

    Merci beaucoup !



    Hayden Joy
    FémininAge : 23Messages : 24

    le Mer 15 Jan 2014 - 18:59

    Merci !
    Chou.
    FémininAge : 20Messages : 22

    le Mer 15 Jan 2014 - 20:20

    Merci , merci <3



    Ninchat
    FémininAge : 24Messages : 6

    le Jeu 16 Jan 2014 - 18:03

    J'aime beaucoup ! Merci
    Zeyro
    FémininAge : 24Messages : 3

    le Sam 18 Jan 2014 - 0:45

    Testons cela ! Merciii
    Faraday
    FémininAge : 26Messages : 39

    le Jeu 23 Jan 2014 - 11:18

    Merci!
    Contenu sponsorisé

    Aujourd'hui à 5:54


      La date/heure actuelle est Mar 17 Jan 2017 - 5:54