CSS - Géométrie

Bonjour à vous !

Je voulais savoir s'il était possible de créer la forme suivante, simplement à partir d'une seule div ?
Il faudrait appliquer la propriété 'rotate' au côté gauche de la div, mais je ne vois pas comment procéder sans avoir à utiliser deux divs.
Toute aide est la bienvenue,



Merci d'avance.
Flox
Modifié par flox (28 Dec 2016 - 08:08)

Et du coup :

.trapezoid {
  height: 10rem;
  width: 10rem;
  border-top: 10rem solid Red;
  border-right: 5rem solid transparent;
}

Code en ligne : CodePen

Mais tout cela reste du bricolage, pour les réalisations plus pointues on préfèrera se tourner vers du SVG.

Yordi a écrit :


Dommage qu'on ne puisse pas mettre de like à une réponse (j'aurais liké ta réponse)

ça va venir plus vite que tu ne le penses

Raphael a écrit :
ça va venir plus vite que tu ne le penses

Ah ah ! La nouvelle version du forum - attendue comme d'Arlésienne - poindrait-elle le bout de son nez en ce (très bientôt) début d'année 2017 ? Suspense...