[CSS] Mettre une bordure sur un lien en display:block

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : [CSS] Mettre une bordure sur un lien en display:block

Pascal le nain

J'ai fait une barre d'onglet, avec un style différent sur les boutons selon si c'est celui actif.
Et ô désespoir, les bordures n'apparaissent pas.

Pourtant, tout le style bien appliqué au bouton, firebug reconnait bien la classe, et les bordures figurent bien dans la liste de style.
La barre webdeveloper ne m'indique pas d'erreur css.

Mais pour les navigateurs (tous), ya rien, les bordures n'apparaissent pas, alors que tous les autres attributs sont pris en compte !

Ma classe est déclarée ainsi :

.menu_onglet_down
{
display:block;
float:left;
font-size:14px;
background-color:#BDBEB5;
color:#4E4E4E;
border-right:solid #000000 1px;
border-bottom:solid #000000 1px;
padding:5px;
}

Mon code :

Si je remplace les <a> par des <div>, les bordures apparaissent.

On ne peux pas mettre une bordure à un lien en display:block ? Depuis quand ? [:kurt haribo]

Merci :hello:

EDIT : Ah et tiens, une question subsidiaire, pas du tout en rapport : pourquoi liste > div pour un menu ?

Message cité 1 fois
Message édité par Pascal le nain le 11-08-2009 à 10:25:57

Publicité

macgawel

Pascal le nain a écrit :

Mon code :

Si c'est bien ton code, c'est pas trop étonnant que ça ne marche pas.
Tu utilises un éditeur de texte à coloration syntaxique ? Si non, tu devrais :ange:

Encore un conseil, utilise les balises [ code=php] ou au moins le bouton "code" pour afficher du code, c'est mieux que [ fixed].
Là, tu devrais voir tout de suite ce qui cloche...

Code :

<a href="lolilol.html class="menu_onglet_down">Lien</a>

Pascal le nain a écrit :

EDIT : Ah et tiens, une question subsidiaire, pas du tout en rapport : pourquoi liste > div pour un menu ?

Parce que
Le DIV, c'est pour du DIVers.
Un menu, c'est une liste d'éléments (les liens) qui forment un tout (le menu). Du coup, il est logique (web sémantique) de mettre le menu dans une liste.
Le DIV ne permet pas en lui-même de comprendre que le menu est un bloc logique.

Pascal le nain

Nan, l'erreur n'est pas là. J'ai oublié le guillemet en changeant les nom des fichiers pour le mettre sur le forum, mais le code original est correct
J'utilise notepad++, donc ca se voit tout de suite en cas d'erreurs connes.

Une autre suggestion ?

Et merci pour l'explication :hello:

EDIT : Et j'utilise tout le temps les balises "fixed" parce que quand on copie/colle un code qui vient d'une balise "code" pour le tester, on copie/colle aussi les numéros de ligne, et faut les enlever 1 par 1.

Message cité 1 fois
Message édité par Pascal le nain le 11-08-2009 à 10:33:56

macgawel

Pascal le nain a écrit :

Le problème doit venir du reste du code, alors. J'ai fait une page avec juste les liens, et j'ai bien les bordures...

Code :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
     <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >
<head>
     <title>Bienvenue</title>
     <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
 <style type="text/css">
.menu_onglet_down
{
 display:block;
 float:left;
 font-size:14px;
 background-color:#BDBEB5;
 color:#4E4E4E;
 border-right:solid #000000 1px;
 border-bottom:solid #000000 1px;
 padding:5px;
}
    //-->
</style>
</head>
<body>
 
<div class="contenu">
<a href="lolilol.html" class="menu_onglet_down">Lien</a>
<a href="lolilol.html" class="menu_onglet_down">Lien</a>
<a href="lolilol.html" class="menu_onglet_down">Lien</a>
</div>
</body>
</html>

(sous IE6+ et FF 2 )

Pour le copier/coller du code :
- Double-clic dans le cadre => Suppression de la numérotation.
- Copier/coller.
:sol:

Message cité 1 fois

Pascal le nain

macgawel a écrit :

- Double-clic dans le cadre => Suppression de la numérotation.
- Copier/coller.
:sol:

Pff ah ouais... c'est sûr si on me dit rien à moi [:tim_coucou]

Message édité par Pascal le nain le 11-08-2009 à 10:44:57

FORUM HardWare.fr

Programmation

HTML/CSS

[CSS] Mettre une bordure sur un lien en display:block

Sujets relatifs
mettre des div a l'interieur d'un tableau	Mettre autre URL en php
PROBLEME d'if comportant un lien	expression reguliere : recuperer lien internet
Problème lien sous un swf transparent	[HTML/CSS] Affichage version mobile
Mettre le contenu interpretté d'un fichier php dans une variable	inserer lien sur forum avec lecture uniquement du mp3
CSS - Redimensionner automatiquement div avec background	[CSS] Impossible de localiser où changer la couleur du menu
Plus de sujets relatifs à : [CSS] Mettre une bordure sur un lien en display:block

Page générée en 0.058 secondes