Astuce HTML / CSS : Imbriquer des liens

[@KrisDesChacals]

Si ::before ou ::after n'est pas utilisé sur le lien à "étendre" à toute la carte, c'est même encore mieux d'utiliser les pseudo-éléments, plutôt qu'une vide.

[@grafikart]

Clairement bonne remarque les pseudos éléments sont encore mieux si on n'en a pas besoin.

[@grafikart]

Comme certains l'ont fait remarqué il est aussi possible d'utiliser les pseudos éléments ::after & ::before à la place de la span (si on n'a pas besoins des pseudo éléments pour le style)

[@patricesinclair1264]

Tres bon tutoriel. Merci pour cet astuce. ceci vient booster le peu de connaissance que jai en css

[@KaitoFlash]

Tu viens de me faire découvrir inset 🤯😁 Merci beaucoup pour les tips !

[@less466]

merci beaucoup,video tres interessanter ,ce serait super d'en avoir un peu plus de ce genre d'astuce.

[@yacinemaouche105]

Au top comme d'hab. PS: j'aime bien ces petites vidéos plein d'informations, surtout sur le css.

[@bobdylan8464]

Merci pour ton travail ! Tu es vraiment au top

[@FdWebdesign]

💯Great information💯

[@nico77]

Super astuce. Merci du partage.

[@idoexperiences]

Hello, pour ma part quand j'imbrique plusieurs liens comme ca, j'entour les liens enfants d'une balise object. De cette manière : monlien enfant ca fonctionne sans à avoir à faire de tricks au niveau du CSS, et de mémoire je pouvais également custom le hover des enfants indépendamment du parent. Par contre côté accessibilité j'avoue que j'ai fait aucune test ... Et c'est sûrement là que ta méthode performe le plus ! Merci pour ton astuce en tout cas ;-)

[@xBlueBuff]

Salut, est-ce toujours le plugin Livereload que tu utilises pour rafraichir ton rendu automatiquement ?

[@sprichie2]

Génial ! J´en avais besoin 😃 Merci beaucoup !

[@maitozo]

Il ne serait pas possible de le faire avec un display grid plutôt que des positions ?

[@toblamabor7072]

j'avais eu ce probleme et résolu avec du js il me semble, même si pour le SEO et peut être accesibilité c'est pas top, je ne comprends pas pourquoi on a pas de tag comme "" ou un truc du genre pour ce genre de soucis

[@YonathanBenitah]

Sympa ce format de 5 minutes 😁

[@freehzaix]

merci coach

[@brunodelpiero]

Merci :)

[@MarzoukBoladji]

GG finally something that works

[@jeanmionnet8084]

Quid de l'UX ainsi que de l'accessibilité ?

[@grafikart]

Niveau accessibilité c'est bon car le lien est considéré comme étant sur le titre. Par contre niveau UX je ne sais pas du tout.

[@theob.1779]

Merci Jonathan pour votre démonstration, cependant je me questionne sur la pertinence au niveau UX d'avoir un élément cliquable au sein d'un autre élément lui aussi cliquable. Est-ce que vous auriez des retours d'expérience sur ce point ? Dans mon équipe, nous avons conclu que ce n'était pas une bonne pratique, mais aucun d'entre nous nous n'a pour l'instant une expérience de senior, et il se pourrait que ça marche bien dans certains cas ..?

[@DhainautRaphael]

Etant frontend developer, je confirme d'un point de vue UX ce n'est généralement pas conseillé comme pratique (la superposition d'action n'est pas l'idéal). Mais c'est aussi ça le web, on peut faire du sur mesure et il n'y a pas de règles qui l'interdisent. Finalement ça dépend du choix du design. En plus coté technique si on suit le tuto de Grafikart => bonne nouvelle c'est faisable et W3C compliant.

[@MrLegueye]

ty bruu

[@MrShadows]

Plutôt utiliser un pseudo-élément before ou after plutôt qu'un span vide.

[@grafikart]

Effectivement (sauf si on compte utiliser les pseudos éléments pour autre chose, flêche sur le lien ou autre)

[@patricesinclair1264]

Bonjour Grafikart. je suis nouveau sur ta chaine et je trouve tes tutos tres interessants. Depuis lors j ai suivi les tutos en html & css. Du coup j ai aussi envie de me lancer pour devenir un Developpeur web et applications Web. Seriez Vous gentil de me former dans ce domaine afin je sois autonome et un bon freelancer ? Vraiment cela me ferais enormement plaisir & vous me rendriez un tres grand service. Merci

[@nassaezeckiel7275]

Salut..Une formation complète en Flutter ne serait pas de refus..

[@grafikart]

Il est peu probable que j'évoque Flutter sur cette chaine mais je te renvois chez Graven qui commence une formation sur le sujet : kzbin.info/www/bejne/m3zSoGidoKp5oLM

[@nassaezeckiel7275]

@@grafikart merciiiii

[@renovation-maison]

La majorité des visiteurs de sites sont sur smatphones de nos jours. Donc plus de hover ni de focus

[@grafikart]

Cela dépend du site je ne ferais pas une généralité sur ce point.

[@dukenuggets]

moi je l'ai fait d'une manière complétement différente

[@grafikart]

N'hésite pas à partager , cela peut être intéressant d'avoir les approches de chacun

[@lmz-dev]

John Doe est une fille !? Je n'aurais jamais cru ça ;p

[@darkodeur9603]

2022 année de la transition

[@lmz-dev]

@@darkodeur9603 tansgenrisation* ;p

[@darkodeur9603]

@@lmz-dev ahah même pas j'en connais une qui transitionne en ce moment d'après ses dires

[@GladiatorsBattleOfficial]

Pas vraiment d'accord, le moyen le plus propre et facile tiens en une ligne ajouter un span au dessus de l'element qu'on veut rendre cliquable et d'ajouter un truc du genre onclick="event.preventDefault(); document.getElementById(' ') .submit(); return false;

[@grafikart]

Cela ne marchera pas avec un clic droit pour copier le lien ou l'ouvrir dans un nouvel onglet / fenêtre et ce n'est pas optimal pour l'accessibilité non plus.