Onglets en Css

Version imprimable

Onglets en Css

Bonjour à tous,

Déjà bonne année :ccool:

Voilà mon problème, j'ai créé un menu de type onglet en html/css. Sur certains navigateurs (IE, Opera) et certaines versions de Firefox, lorsque je suis sur un onglet, il devrait se colorer en fond vert/ écriture blanche, or il reste normal (fond transparent / écriture bleu).

Pourriez-vous m'aider ?

Voici le code html / css :

Code:

1
2
3
4
5
6
7
8
9
10
<div id="nav">
    <div id="tabnav">
        <ul>
            <li ><a href="index.php">Accueil</a></li>
            <li ><a href="midi.php">Midi</a></li>
            <li class="current"><a href="soir.php">Soir</a></li>
            <li ><a href="contact.php">Contact</a></li>
        </ul>
    </div>
</div>

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
#nav {
    width : 476px;
    height : 38px;
    float : right;
    margin-top : -25px;
    margin-right : 4px;
}
    #tabnav {
        background: transparent;
        width : 480px;
        height : 38px;
    }
    #tabnav li {
        display : inline;
        height : 308px;
        list-style-type: none;
        }
    #tabnav a:link, #tabnav a:visited {
        font-family : vivaldi;
        font-size: 26px;
        font-weight : bold;
        text-decoration: none;
        margin-right : 25px;
        height : 28px;
        color: #67A0E5;
        padding-left : 5px;
        padding-right : 5px;
     }
    #tabnav li.current a:link, #tabnav a:hover{
        font-size: 26px;
        color: #FFFFFF;
        height : 25px;
        margin-right : 25px;
        background : #4C834A;
        padding-left : 5px;
        padding-right : 5px;
       }

Merci d'avance pour votre aide.

Philou El Geek.

02/01/2011, 20h47
e-fitz

Bonsoir,

je viens te tester ton code je n'ai pas de problème de lien, par contre ton menu ne fonctionne pas du tout sous ie6.

Peut être tu ne nous a pas donné la portion de code qui crée le problème.

Essaye de mettre une classe sur tes liens pour voir si ca améliore les choses.

Bonne soirée
04/01/2011, 16h58
Davonex

Bonjour

Peux-tu nous dire quelle est le navigateur qui ne reconnais pas correctement ton code.

Car j'ai fait un test sur IE 6.0.2900.5512.....etc , Firefox 3.6.13 et Safari 5.0.3 et toute a l'air de fonctionner correctement

Cordialement
05/01/2011, 08h52
philouelgeek

Désolé de ne pas avoir répondu avant,

@Davonex : J'ai le problème sous IE8 et Opéra.

@e-fitz : Je vais tester ça, je vous tiens au courant.

Si vous voulez tester avec le site complet, c'est à cette adresse que ça se passe :

http://philippeant.free.fr

@++
05/01/2011, 11h52
e-fitz

Bonjour,

Dans mes souvenirs ie avait un gros soucis dans les positionnements de lien avec padding et margin, peut cela vient de la ?

Je regarde de plus près quand je rentre si tu n'as pas corrigé.
11/01/2011, 20h45
channark

peu être cette outil peut aider à reconnaitre les problemes de ton site sous différents navigateurs.
http://webmastring.net/browsershots.html
12/01/2011, 16h38
philouelgeek

Merci.

J'ai résolu mon problème, j'ai repris entièrement la partie onglets et maintenant ça fonctionne niquel.

En tout cs merci pour vos réponses :ccool:

@+