Pobleme validation Xhtml Css

Bonjour, je n'arrive pas a faire valider ces lignes :

Code:

---

1 2 3 4 5 6 7 8 9

<td class="style3"> <a href="#"><div id="bouton1"></div></a> <a href="#"><div id="bouton2"></div></a> <a href="#"><div id="bouton3"></div></a> <a href="#"><div id="bouton4"></div></a> <a href="#"><div id="bouton5"></div></a> <a href="#"><div id="bouton6"></div></a> </td>

---

Voici les erreurs relatives a chaque ligne (la même erreur):
# Error Line 120 column 20: document type does not allow element "p" here; missing one of "object", "applet", "map", "iframe", "button", "ins", "del" start-tag.

<a href="#"><p><div id="bouton1"></div></p></a>

The mentioned element is not allowed to appear in the context in which you've placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you've forgotten to close a previous element.

One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").

✉

Salut,

Tu n'as pas le droit d'être des éléments blocs dans des éléments en ligne.
les a sont en lignes et les div sont en blocs.

peut-être peux tu plutot essayer quelque chose comme ca:

Code:

---

<div><a...>bla bla</a></div>

---

non ca ne marche pas. En fait j'uilise des div pour que sur le hover de la div, mon bouton change d'apparence (géré par des images)

défini dans ta css ton a avec display:block;
il pourra maintenant recevoir des dimensions et tout les navigateur (les plus utilisés) sont compatible avec la pseudo classe a:hover
et tu peu faire changer ton image d'arriere plan sur le a:hover

Citation:

---

Envoyé par dibeloni

non ca ne marche pas. En fait j'uilise des div pour que sur le hover de la div, mon bouton change d'apparence (géré par des images)

---

Le hover sur une balise autre que <a> ne fonctionne pas avec IE.

:salut:
Essaie ceci : tu mets tes 2 images l'une en dessous de l'autre et tu les colles (avec Photoschop ou même Paint), comme ceci par exemple :http://robspo.free.fr/dreamcloth_site/images/fond.gif
Ensuite dans ton HTML tu fais ceci :

Code:

---

1 2 3 4 5 6 7 8

<div id="change_bouton"> <a href="#"></a> <a href="#"></a> <a href="#"></a> <a href="#"></a> <a href="#"></a> <a href="#"></a> </div>

---

et dans ton CSS tu fait ceci :

Code:

---

1 2 3 4 5 6 7 8

#change_bouton a{ background: url(images/ton_image.gif) no-repeat 0 0; height: 30px;/*si ton bouton fait 60px de haut (tu mets la moitité en gros)*/ }   #lienmenu a:hover { background-position: 0 -30px; }

---

et ça devrait être bon.

Sinon tu garde tes 2 images et tu fais ceci (pour chaque image):

Code:

---

1 2 3

<img onmouseout="this.src='ton_image1.gif'" onmouseover="this.src='ton_image2.gif''" src="<this.src='ton_image1.gif'" alt="ton_image"/>

---

j'ai trouvé ! merci

Code:

---

<div id="bouton3"><a href="page3.php"><img src="images/bouton3.gif" alt="bouton3" onMouseOver="this.src='images/bouton3b.gif'" onmouseout="this.src='images/bouton3.gif'" /></a></div>

---

Citation:

---

Envoyé par dibeloni

j'ai trouvé ! merci

Code:

---

<div id="bouton3"><a href="page3.php"><img src="images/bouton3.gif" alt="bouton3" onMouseOver="this.src='images/bouton3b.gif'" onmouseout="this.src='images/bouton3.gif'" /></a></div>

---

---

C'est exactement ce que je t'ai marqué au dessus;)