Problème de css grrrrrrrr…

  • WordPress :5.2
  • Statut : non résolu
8 sujets de 1 à 8 (sur un total de 8)
  • Auteur
    Messages
  • #2276149
    ericka94
    Participant
    Initié WordPress
    19 contributions

    Bonjour,

    Ma configuration WP actuelle

    • Version de PHP/MySQL : 7.2
    • Thème utilisé : Leedo

    Problème(s) rencontré(s) : Alors voilà, je ne suis pas une pro des css, mais généralement j’arrive à me débrouiller sauf que là, je sèche.
    Pour les inter-titres de mon site, je dois mettre un fond noir, j’ai fait ceci :

    .soustitre {
    font-family: var(–sf);
    font-size: 22px;
    font-weight: 500;
    text-transform: uppercase;
    background-color: #000000;
    color: white;
    padding-top: 3px;
    padding-left: 10px;
    padding-bottom: 3px;
    }

    Le résultat est satisfaisant, sauf que le fond noir se met sur toute la largeur de ma colonne (voir fichier joint en haut ce que j’obtiens et en bas ce que je souhaite). J’aimerai que le noir ne s’affiche que derrière du texte. J’ai donc essayé avec ce code :

    .soustitre {
    font-family: var(–sf);
    font-size: 22px;
    font-weight: 500;
    text-transform: uppercase;
    text-decoration-color: #000000;
    color: white;
    padding-top: 3px;
    padding-left: 10px;
    padding-bottom: 3px;
    }

    Mais rien à faire, il ne reconnait pas du tout ce css text-decoration-color, même en forçant avec un !important.
    Quelqu’un aurait une idée ? Mille mercis !

    • Ce sujet a été modifié le il y a 1 week et 5 jours par  ericka94.
    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2276152
    PhiLyon
    Modérateur
    Maître WordPress
    23553 contributions

    Bonjour.

    Il faut utiliser la balise <mark> https://developer.mozilla.org/fr/docs/Web/HTML/Element/mark

    🙂

    #2276171
    Flobogo
    Modérateur
    Maître WordPress
    15778 contributions

    Bonjour,

    Ou bien une balise span, comme ceci :

    <span class=”soutitre”>votre texte ici</span>

     

    Je déplace la demande en rubrique “thèmes”. Les questions de CSS vont dans cette rubrique.

    #2276175
    ericka94
    Participant
    Initié WordPress
    19 contributions

    Merci à vous deux d’avoir pris le temps de me répondre.
    J’ai essayé le span… sans succès 🙁
    Et j’ai essayé la balise <mark>, j’ai même placé mon code css pour le tester sur cette page
    https://developer.mozilla.org/fr/docs/Web/HTML/Element/mark

    mark {
    font-family: var(–sf);
    text-transform: uppercase;
    font-size: 22px;
    font-weight: 500;
    background-color: #000000;
    color: white;
    padding-top: 8px;
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 8px;
    }

    Mais une fois sur le site ! La mise en page déconne avec du blanc en plein milieu du titre !! Je vous mets une copie d’écran pour que vous puissiez voir le résultat…

     

     

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2276177
    PhiLyon
    Modérateur
    Maître WordPress
    23553 contributions

    Bonjour.

    J’ai testé ton code dans Twenty Sixteen, avec la police Arial et c’est bon.

    🙂

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2276179
    ericka94
    Participant
    Initié WordPress
    19 contributions

    Tu aurais une idée de la raison pour laquelle sur le site l’affichage déconne?

    #2276181
    PhiLyon
    Modérateur
    Maître WordPress
    23553 contributions

    La police, le thème, montres-nous la ligne HTML

    🙂

    #2276238
    ericka94
    Participant
    Initié WordPress
    19 contributions

    J’ai trouvé la solution – pour ceux qui auraient le même problème que moi.
    Dans le code css, il fallait juste ajouter ceci

    .soustitre {
    font-family: var(–sf);
    display: inline-block;
    font-size: 22px;
    font-weight: 500;
    text-transform: uppercase;
    background-color: #000000;
    color: white;
    padding-top: 3px;
    padding-left: 10px;
    padding-right: 12px;
    padding-bottom: 3px;
    }

    Tant d’heures de recherche pour ca, c’est rageant. Merci!

8 sujets de 1 à 8 (sur un total de 8)
  • Vous devez être connecté pour répondre à ce sujet.