Bienvenue sur le forum d'entraide d'OverBlog.
Nous vous conseillons de chercher une réponse sur notre base de connaissances avant de poster une demande sur le forum.
[RÉSOLU] Encadrement widget et autres modifications
  • Bonsoir :) 

    pages catégories lien 

    Val 

  • Bonsoir

    Avant style tu colle:

    .widget {
        margin-bottom: 25px;
        border: 2px solid;
        border-radius: 8px;
        background-color: #BCD2E4;
    }


    .widget .widget-title {
        color: #666;
        font-size: 15px;
        font-weight: 800;
        letter-spacing: 1px;
        text-transform: uppercase;
        margin: 8px;
    }

    ____________

    explication:

    .widget

    .widget {
        margin-bottom: 25px;  (marge basse)
        border: 2px solid; ( encadrement 2 px)
        border-radius: 8px; (bord encadrement arrondi..plus joli)
        background-color: #BCD2E4; (couleur de fond de l'ensemble des widgets)
    }


    titre des widgets

    .widget .widget-title {
        color: #666; (couleur)
        font-size: 15px; (taille de la font)
        font-weight: 800; ( j'ai augmenté le coté "gras" de la fonte (500 actuellement..je l'ai mis a 800)
        letter-spacing: 1px;
        text-transform: uppercase;
        margin: 8px; ( j'ai ajouté une petite marge pour que le titre ne soit pas trop collé à l'encadrement)
    }


    ________________

    concernant le style de police du texte des widgets;..j'arrive pas à les modifier indépendamment..si on change le style ( arial, trebuchet etc...), on change aussi celui des articles

    __________

    Pour augmenter le nombres de catégories à afficher sur le blog il y a un fil sur la faq de ce forum traitant du sujet

    l'encadrement ajouté (border 2px solid) s'adapte automatiquement au nombre de catégories affichées

  • tu peux tester aussi avec un fond plus clair

    .widget {
        margin-bottom: 25px;
        border: 2px solid;
        border-radius: 8px;
        background-color: #D2FAFB;
    }

    ______________

     #D2FAFB; au lieu de  #BCD2E4; sur le post au dessus
  • Donc ca va le résultat me conviens, merci encore pour ton aide . 
    Humm par contre si tu pouvais m'aider pour modifier page categorie lien . 

    Ensuite j'attaque les liens direct du menu pour ouvrir les pages directement dans une autres page internet . 
    Mais j'avoue que cela me fais un peu beaucoup peur . :)  . 

    Une chose a la fois :)
    Merci bien en tous cas, j'y serai pas arrivé sans toi . 

    Val
  • Pour ton info personnelle

    Différence entre "margin" et "padding"

    Prenons un rectangle encadré comme sur tes colonnes (une boite donc)

    ce rectangle encadré a 4 cotés.....la marge extérieur sera le "margin"

    Si on écris: margin:10px....une marge de 10 px va s'appliquer au 4 cotés extérieur

    Si on veut jouer sur une marge d'un seul coté de la "boite", on peut jouer individuellement sur: margin-top.....margin-right;......margin-left;......margin-bottom;

    _________________

    Le padding:

    Reprenons notre boite avec son encadrement et ses 4 cotés

    On peut jouer sur les marges INTERIEUR de la boite, on appelle cela a ce moment le padding

    dans ton cas, pour éloigner un peu par exemple la dernière ligne de texte d'un des widget en colonne, on ajoute un padding de 10 px (par exemple) et la dernière ligne de texte passe à 10 px du bord bas de la boite encadré

    les meme valeur peuvent s'appliquer comme pour le "margin"

    Si on écris: padding:10px.....une marge de 10 px va s'appliquer au 4 cotés INTÉRIEUR

    Si on veut jouer sur une marge d'un seul coté de la "boite", on peut jouer individuellement sur: padding-top.....padding-right;......padding-left;......padding-bottom;


    • Pour résumer, le margin joue sur les cotés extérieur de la boite concerné

    • le padding joue sur les marges interne de cette boite

  • Merci pour ces précisions Mehdi, trés instructifs et impératif a maîtriser pour la présentation . 
    Bien vu aussi pour le Padding bottom ( je trouvais pas, mais un truc me génais ) 
    C'etais ca .cette marge trop basse .