Bonjour, j'ai un projet à rendre et je bloque sur quelques point. Je dois reproduire une page web entièrement mais je bloque sur pas mal de point dont un où j'ai une phrase du type ; "Voici un site plein de ressources ici" vous l'avez surement compris le mot "ici" est un hyper lien qui amène à un site quelconque.

Cette hyper lien est écrit en violet et souligné mais jusque là tout vas bien, j'ai réussi à le reproduire, le problème étant que cette phrase entière est décorée d'une ligne au dessus toute noire. J'ai réussi à mettre la ligne avec " text-decoration: overline; " et j'ai aussi rajouté " text-decoration-color: black; " mais la partie juste au dessus du lien donc du "ici" reste en violet et je n'arrive pas à la mettre en noire.

J'espère que vous allez pouvoir m'aidez, merci d'avance bonne journée.

    c'est ce que j'ai fait

 c'est ce qui est attendu

HTML

<p class="p3" > Un site plein de ressources <a href="https://www.google.com"> ici </a>  </p>

.p3 {
	text-align : left;
	text-decoration: 2px overline black ;
	text-decoration-color: black;
}

CSS

Si j'etais à votre place au lieu de tenter avec du text-decoration j'aurai simplement mis un border-top: solid 2 px black; sur le p3.

Ensuite si la bordure est trop collé au texte juste padding-top devrait suffir

-
Edité par zvheer 22 novembre 2021 à 22:00:44

C'est normal car un element de type block occupe a la base 100 pourcent du conteneur qui ici est le body

tu dois ajouter la propriété width: fit-content;

Super j'ai réussi merci beaucoup!!

multifruit17 a écrit:

Super j'ai réussi merci beaucoup!!

Bonjour,

Sujet résolu