[résolu] Header cliquable

Mon site contient un header défini dans le css file (Mouarf! on dirait Vandame qui cause !).

html :

 <div id="header"></div>

CSS :

#header{
background: url(images/ban3.gif) no-repeat;
width: 614px;
height: 150px;
}

Mais comme Roger me l'a suggéré, je souhaite rendre le header cliquable.

J'ai trouvé la bidouille suivante :
html:

 <div id="header"> <a href="index.html"><span id="header1"></span></a></div>

CSS :

#header{
background: url(images/ban3.gif) no-repeat;
width: 614px;
height: 150px;
}
#header1{
width: 614px;
height: 150px;
visibility: hidden;
}

Ca fonctionne avec IE mais pas avec Moz. Il semble que ce soit la propriété visibility: hidden qui merdouille, pourtant elle semble validée par le W3C.

Je me suis inspiré de ça
Thx.
Modifié le 10 Feb 2005 - 17:47

Bonjour Scaramanga !

Ton <span> étant caché et ton <a> n'ayant pas de dimension, pas étonnant que ça merdoie.
En principe, on ne donne pas de dimension à un élément de type "inline", <a> en l'occurence.
Il faut donc lui dire display: block; et lui dire quel espace il doit occuper.
Puisque tu parles d'un header, un véritable header serait tout approprié.

Tu peux essayer quelque chose de ce genre :

Le HTML :

<h1><a href="index.html"><span>Titre du header</span></a></h1>

Le CSS :

* {padding: 0; margin: 0;}
h1 { 
   background: transparent url(images.jpg);
   width: 700px; 
   height: 72px; 
}
h1 a { 
   display: block; 
   width: 700px; 
   height: 72px; 
   text-decoration: none; 
}
h1 span { 
   position: absolute; 
   left: -9999px; 
   top: -9999px; 
}

En ce qui me concerne, je ne suis pas du tout gêné d'utiliser une image en dur dans le HTML s'il s'agit d'un header (logo de compagnie par exemple).

<h1><a href="index.html><img src="image.jpg" width="700" height="72" alt="Bienvenue chez Scaramanga" /></a></h1>

L'image restera visible même si CSS est désactivé.
Dans un navigateur graphique, le texte alternatif sera affiché avec les propriétés de <h1> si l'image n'est pas chargée.
<h1> n'apparaissant normalement qu'une seule fois dans une page, pas besoin de "id" ou de "class".

Les différentes méthodes pour masquer du texte sont toutes une source potentielle de problèmes.

Oui mais un logo c'est de la présentation, et la présentation ne doit-elle pas se faire via CSS ?
Oui et non. Un logo de compagnie est une identité visuelle et a tout à fait sa place en dur dans une page HTML.

Dans tous les cas, ça vaut mieux qu'une bidouille douteuse pour masquer du texte.
Modifié le 10 Feb 2005 - 08:07

Merci pour cette réponse pour le moins complète !
J'étais parti en effet du principe selon lequel la présentation devait dans l'absolu, être qu’une affaire de CSS. Hors, ton raisonnement me convainc du contraire, dans ce cas précis.
La démonstration du code CCS est magistrale, et j'en prends bonne note !
Merci !