Souligner un titre avec un point rouge sur le côté (Créer un compte)

  • WordPress :5.8
  • Statut : non résolu
7 sujets de 1 à 7 (sur un total de 7)
  • Auteur
    Messages
  • #2386568
    Chimshone
    Participant
    Initié WordPress
    4 contributions

    Bonjour,
    Je vous demande de l’aide pour pouvoir souligner un titre sur wordpress avec Elementor, en mettant un point rouge sur le côté rouge ( dont je pourrais contrôler la taille et l’espace entre le titre et le point rouge ), tout en pouvant contrôler la taille du soulignement et l’espace entre le titre et le soulignement.
    J’espère avoir été clair sur la demande 🙂

    Sinon, j’ai envoyé un screen shot de ce que je voulais avoir en fusionnant les 2 lignes pour avoir la même chose mais souligné.
    Merci de votre aide.

    • Ce sujet a été modifié le il y a 2 jours par Lumiere de Lune.
    • Ce sujet a été modifié le il y a 1 jour et 23 heures par Flobogo. Raison: déplacé en rubrique "Elementor"
    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2386580
    Lumiere de Lune
    Participant
    Maître WordPress
    19597 contributions

    Hello, Un css avec un élément before

    #2386647
    Chimshone
    Participant
    Initié WordPress
    4 contributions

    Rebonjour,

    Merci pour votre réponse !

    Du coup, j’ai mis ceci comme code sur le title

    .Title::before {
    content: “•”;
    color: red;
    display: inline-block;
    width: 1em;
    margin-left: -1em;
    }

    mais il apparait pas sur la même ligne. Ci-joint le screen.

    Sauriez-vous ce que je dois rajouter ? Et le point rouge sera t-il lui aussi souligné ?

    Merci.

     

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2386661
    Lumiere de Lune
    Participant
    Maître WordPress
    19597 contributions

    Enleve le display inline block je pense.. et si tu pouvais mettre l’url de ton site ça serait plus facile.

    #2386665
    Chimshone
    Participant
    Initié WordPress
    4 contributions

    Désolé, le site n’est pas encore en ligne, j’aurais bien aimé vous le montrer.

    Entre temps, j’ai finalement réussi à souligné comme je voulais mon titre avec le point rouge.
    Par contre, je n’arrive pas à 1) Modifier la taille en horizontal de mon soulignement. 2) Modifier la taille du point rouge ni a le placer comme je veux et 3) En responsive, le soulignement touche directement le texte.

    Je suis désolé de toutes mes demandes, je vous demande pas de faire mon travail, seulement si vous pouvez m’aiguiller.

    Ci-joint les screens et le code.

    Code :

    h1::before {
    content: “•”;
    color: #C1272D;
    }

    h1 {
    text-underline-offset: 5px;
    text-decoration: underline;
    text-decoration-color: #C1272D;
    text-decoration-thickness: 3px;
    }

    Merci beaucoup !

    Fichiers joints :
    Vous devez être connecté pour voir les fichiers joints.
    #2386693
    Lumiere de Lune
    Participant
    Maître WordPress
    19597 contributions

    Bonjour

    le problème, c’est que beaucoup de choses jouent sur l’apparence d’un élément donné, y compris les css qui le contiennent ou des css généraux. Donc sans pouvoir inspecter le code et voir ce qu’on appelle le css calculé c’est difficile. Néanmoins, plutôt que text-decoration, je vous conseillerais de jouer avec les border, qui sont beaucoup plus souples

    #2386719
    Chimshone
    Participant
    Initié WordPress
    4 contributions

    Ha d’accord, je comprends.

    J’ai essayé de souligné avec le border mais j’ai jamais fais ça 🙁

    Je reposterais un message quand je mettrais un site en ligne comme ça vous pourrez m’aider plus facilement du coup.

    Merci pour tout !

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