Problème avec un background dans un tableau

J'essais de mettre un background dans des cellules d'un tableau (mise en page en tableau ...)
Mais ca ne fonctionne pas du tout ...


Quel sont les différences entre background, background-image, background-url ?

Faut-il mettre des guillemets quand on donne le lien vers une image ?
Le chemin de l'image, c'est bien à partir de la css ?

Pour mettre un background dans une cellule, il suffit de donner un id au td, et d'ajouter dans la css #id_td { backgroun; } ? Ca ne pose pas de problème avec tout les tr/td qui le précéde ?

J'ai même essayé en mettant toute les syntaxes possible en même temps ...
background-image:url(fond.gif) fonctionne sous IE mais pas sous firefox.

salut, dans ton fichier html, tu mets :

Code:

---

<td class="perso">

---

et dans ton css

Code:

---

1 2 3

.perso {background-image: url("images/fond.jpg"); }

---

C'est ce que j'ai fait, sauf que j'ai mis un id au lieu d'une classe ..
J'ai bien evidement essayé avec la classe auparavant.

Code exact

Code:

---

1 2	<td class="6_5" width="29" height="27"></td> .6_5 { background-image:url("int_30.gif"); }

---

Sous IE ca fonctionne.

et si tu mets quelque chose dans la case?

Citation:

---

<td class="6_5" width="29" height="27">Quelquechose</td>
.6_5 { background-image:url("int_30.gif"); }

---

essaye sans width et heigh

Déjà essayé ^^ (j'ai quand même retenter)
Ca agrandie la colonne, donc les autre <td> avec background à l'ancienne sont plus grand et ce répéte.

Petit détails, je suis sur OVH, quand je change une page, je suis obligé d'attendre quelques secondes (10-30) avant que le changement soit visible, c'est normal ? Ils utilisent un système de cache ?

essaye comme ceci :

Code:

---

<td background : url="int_30.gif" width="29" height="27">Quelquechose</td>

---

Ne fonctionne pas ...

Ca non plus.

Code:

---

<td style="background-image : url=(int_30.gif) " width="29" height="27">Ohoho</td>

---

Ni ca

Code:

---

<td style="background-image : url(int_30.gif) " width="29" height="27">Oho</td>

---

et ca

Code:

---

<td style="background-image : url(int_30.gif);" width="29" height="27">Ohffo</td>

---

<td style="background: url(int_30.gif)" >Ohffo</td>

Encore raté.

A mon avis j'ai du essayé toute les sorte de syntaxe possible, ca ne viens peut être pas de la, dans ce cas la, c'est la première fois que je vois ca.

le nom de l'image est le bon? Elle se trouve au même emplacement que ton fichier html?Pas dans un sous dossier?

Il n'existe pas de background-image en propriété, c'est en CSS.
2 cas, soit tu utilises du CSS, soit du HTML simple.

HTML

Code:

---

<td background="url_image">contenu</td>

---

CSS

Code:

---

background-image : url('url_image');

---

L'image existe, elle est dans le même sous répertoire que les autres.
Je commence à désespérer.

Peut-etre que les dimensions que tu as specifier sont trop petites pour visualiser l'image de fond...

J'y suis allez petit à petit.
J'ai mis un le background au tableau, au tfoot, au tr, mais ca bloque au td ...
Les dimensions sont ok.

Tu peux remontrer le code que t'as mis ?

L'html ne change pas

Code:

---

<td id="6_5"></td>

---

La css, pour le tr (donc la ligne du tableau est rempli avec cette image, le code fonctionne)

Code:

---

#tableau1 tfoot tr { background-image : url('int_30.gif');}

---

En théorie pour la dernière case du tableau

Code:

---

#tableau1 tfoot tr #6_5{ background-image : url('int_30.gif');}

---

Ca ne fonctionne pas sous firefox, mais sous IE si ...

Il faut mettre un p'tit quelque chose dans la cellule, par exemple un &nbsp;

On à déjà essayé. De mémoire, pour qu'une cellule apparaissent sous IE elle ne doit pas être vide. Sous frefox toute les cellules apparaissent.
C'est d'autant plus bizarre.

Code:

---

1 2 3 4 5 6 7 8 9

<tfoot> <tr> <td id="6_1" height="27" background="images/interface/int_26.gif">&nbsp;</td> <td id="6_2" background="images/interface/int_27.gif">&nbsp;</td> <td id="6_3" background="images/interface/int_28.gif">&nbsp;</td> <td id="6_4" background="images/interface/int_29.gif">&nbsp;</td> <td id="6_5">&nbsp;</td> </tr> </tfoot>

---

La il n'y a que la dernière cellule qui ne s'affiche pas, car elle devrait le faire en css.
Avec

Code:

---

#tableau1 tfoot tr { background-image : url('int_30.gif');}

---

La css prend le dessus, et le background de la css s'aplique sur ceux de l'html.

As-tu essayé simplement avec ?

Code:

---

#6_5 { background-image : url('int_30.gif');}

---

Ouep, j'ai ajouté le reste par la suite, quand j'ai fait petit à petit. (Ca ne fonctionne pas)

quelqu'un à déjà réussi a mettre un background dans une cellule d'un tableau sous firefox ?

Chez moi, ça marche parfaitement, que ce soit sous Firefox ou IE.
As-tu mis un doctype particulier?

Code:

---

1 2 3

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

---

J'avais essayé de l'enlever, mais sans effet. Je retente.

Edit : marche pas.

Il va peut être falloir que j'en mette un ? Je n'y comprend pas grand chose aux en-têtes...

Non, ça n'a rien à voir.
Apparement t'en a pas mis.
Essaies avec ce code simple (qui fonctionne chez moi quelque soit le navigateur)

Code:

---

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16

<html>   <head> <title>test</title> <style> #img {         background-image:url('ton_image'); } </style> </head>   <body> <table><tr><td id="img">contenu</td></tr></table> </body>   </html>

---

damn .... ca fonctionne, je vais galérer à trouver d'ou ca viens ...

La solution : La classe ne doit pas commencer par un chiffre ... Depuis le temps que je fait du css, je n'avais jamais remarqué.
C'est normal ?

En effet, ça ne doit pas commencer pas un chiffre
http://www.w3.org/TR/CSS21/grammar.html#q2

Citation:

---

ident -?{nmstart}{nmchar}*

nmstart [_a-z]|{nonascii}|{escape}
nmchar [_a-z0-9-]|{nonascii}|{escape}

---

Si tu connais un petit peu les expressions regulières...
? : facultatif
* : un ou plusieurs