Intégration onglets en biseau

Bonjour,

Je tombe sur une question à laquelle je ne trouve pas de réponse satisfaisante.
Pour le 1ère fois (ben oui) je réfléchi à intégrer un menu (xhtml / css 2) avec un rendu façon onglets en biseau.

on reste dans un classique ul /li

Et ca m'a l'air pas évident du tout notamment pour l'état actif (en magenta) car pour des portes coulissantes on est hors jeu ..non ? (les extrémités des onglets sont en commun...)

Merci


Modifié par elz64 (17 Jan 2011 - 15:08)

Yop !

Non, les portes coulissantes doivent encore fonctionner.
Simplement, les différents états de tes boutons ne vont pas être accolé dans ton image.
Ou plutôt, ils seront accolé de la taille du rectangle les englobant.
Les parties "communes" seront transparentes.

humm..pas sur de voir la même chose.;

Donc png obligatoires ici

J'ai pensé à utiliser un positionnement relative de chaque li (+ float left) de la gauche vers la droite du + vers le -, (genre z-index 98 pour le 1er, 98 pour le second etc..)
Avoir le fond 'grande longueur' avec extrémité droite dans le li
et le a en block avec une margin-left négative pour recouvrir le li d'avant + padding-left de même valeur ..
et le actif/current prendrait un z-index supérieur à tous..

mais c'est un peu l'usine à gaz.

Tu te poses trop de question je pense :o

Avec un bête .png ça doit être tout a fait possible.
Et si tu ne veux pas utiliser d'image transparente, un coup de JavaScript?