Informatique

Vous voyez les trois boites roses sur ce site en Jap ?
https://elearn-english.jp/about-services/

Je voudrais faire exactement le même type de boite, avec un titre encadré comme cela apparaît sur ce site.

Une idée de comment faire ?

Merci les gens

up?

Tu peux inspecter le code pour récupérer le CSS si tu veux

Mais c'est pas vraiment dur, c'est simplement des border et du background, c'est quoi qui te pose problème en particulier ?

ben j'essaye de copier le code html du truc en l'inspectant mais ça s'affiche pas sur mon site...

Copie l'HTML mais aussi le CSS

Après ils utilisent peut-être une framework CSS

Aucune idée de comment faire pour copier le CSS, j'ai pas les skills...

Je vais essayer de trouver ça sur des forums américains, on sait jamais !

Merci quand même !

Dans ton inspecteur de code tu vas dans l'onglet "Editeur de style" ou tu peux même copier le CSS d'un élément HTML en cliquant dessus.

Tu utilise quoi comme navigateur ?

Je pense c’est un fieldset
https://developer.mozilla.org/fr/docs/Web/HTML/Element/Fieldset

Oui ça a l'air d'etre un fieldtest, mais je pensais pas que c'était aussi compliquer de dupliquer une simple boite avec un titre

Le 25 mars 2020 à 21:04:18 Bromo a écrit :
Oui ça a l'air d'etre un fieldtest

Non

Le 25 mars 2020 à 12:06:44 Bromo a écrit :
Une idée de comment faire ?

Ce n'est rien de plus que trois blocs dans un conteneur <div>, donc il faut apprendre à la construire et la placer où vous voulez

Nuagedecube enfin, merci.

Pour le bloc encadré c'est juste un petit hack, y a plusieurs solutions, le conteneur se trouve à l'interieur de la card / box ( appelez le comme vous voulez ) et tu décales son contenus ( le texte, la couleur ) vers le haut.
Ma méthode préférée reste d'utiliser la propriété transform sur l'encadrement.

Sinon y a la méthode bourrin à base de position absolute, mais je suis pas fan.

Tiens cadeau en 5 min:
https://codepen.io/youtpout/pen/OJVaOGr

Merci Boucif t'es un vrai Khey, que toi et tes proches soient protégés du Covid 19 sur 10 générations.