un tuto pour faire des onglets en css

[Mado]

http://developpeur.journaldunet.com/tutori...s_onglets.shtml

pour que ca donne ca

http://developpeur.journaldunet.com/exempl...ss_onglets.html

ca peut toujours servir

[Guest CraJK]

Oui, sympa mais il y en a plein d'autres.

http://www.crajkaro.com/onglet2.php

[mee2]

Crajk,

Not Found

The requested URL /1.htm was not found on this server.

Apache/1.3.29 Server at www.crajkaro.com Port 80

...

Et puis pompons, hein.

[LaurentDenis]

pour que ca donne ca

http://developpeur.journaldunet.com/exempl...ss_onglets.html

Un peu surprenante, la liste qui s'inverse entre la source HTML (Tab Five en premier) et le rendu CSS (Tab Five en dernier)

[ElMoustiko]

Une de mes sources préférée : http://www.nundroo.com/nav_matrix/welcome2.html

Très évolué, bien chiadé je trouve

@++

[Monique]

Un peu surprenante, la liste qui s'inverse entre la source HTML (Tab Five en premier) et le rendu CSS (Tab Five en dernier) 

C'est le float: right; qui provoque cette inversion...

li {
float: right;
margin: 2px 2px 0 2px;
border: 1px solid black;
background-color: lightblue;
}

Mais pour l'utilisateur d'un lecteur d'écran, ce doit être perturbant

[LaurentDenis]

C'est l'une des raisons pour lesquelles je préfère nettement la solution du display:inline pour mettre une liste à l'horizontal...

[ElMoustiko]

Oui mais display: inline; ne permet pas une gestion facile de la taille des onglets...

Une solution pour mettre à droite une liste de définition sans échanger pour autant l'ordre des liens, c'est d'ajouter une div autour du ul (oui une balise de plus, on va pas pleurer non plus...) et mettre le ul en float: right; et le tour est joué, on peut tranquillement dimenssioner en hauteur et en largeur les élements de la liste grace à display: block; inutilisable pour des éléments inline.

@++