28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Je souhaiterais savoir s'il est possible de simuler en CSS un cellspacing sur une balise td ?
L'attribut cellspacing de la balise table s'applique à toutes les lignes et colonnes, et je souhaiterai ne le faire que sur une colonne, comme sur cet exemple : upload/16170-tableau.jpg

Il faut impérativement que ce soit un seul tableau, séparé donc en 5 colonnes de gauche et 2 de droite.
En utilisant un margin la case de bouge pas et reste coller aux autres, et je ne peux pas utiliser un padding puisqu'il faut que le border soit décalé aussi.

Pour l'instant je vois qu'une solution, mettre une image d'arrière plan d'1px de haut avec la couleur de fond et le border, il me suffit ensuite de caler les colonnes sur le fond.

Existe-t-il une solution plus simple ?

Merci d'avance
Modifié par vichenze (01 Sep 2008 - 13:51)
Ah oui bien vu j'avais pas pensé à ça, je vais voir ce que ça donne merci Smiley cligne

(Si y'a d'autres idées je suis preneur aussi Smiley lol )
Pas mieux pour ma part. Ce n'est pas tout à fait la solution la plus accessible (bien qu'une cellule vide, ça n'est pas très méchant), mais ça devrait être assez simple à mettre en place.
Pas trop le temps de tester, mais dans le cas dans le cas d'un td vide(vraiment vide Smiley cligne ), essayer la propriété empty-cells, çà devrait donner l'illusion:


td.toto{
empty-cells: hide;
}



<tr>
        <td>
          un
        </td>
        <td>
          deux
        </td>
        <td>
          trois
        </td>
        <td>
          quatre
        </td>
        <td>
          cinq
        </td>
        <td class="toto"></td>
        <td>
          sept
        </td>
      </tr>
Florent V. a écrit :
empty-cells: bien, mais moyennement supporté.


En effet çà semble très moyennement supporté.

Remarque que si on en savais un peu plus sur les données du tableau on pourrait peut-être proposer autre chose. Il serait important de savoir le pourquoi de la nécessité d'un seul tableau. Pourquoi se focaliser sur les seuls td ?

Ci-dessous le rendu que j'obtiens sous Win:
IE7
upload/128-ie7.png
Firefox 3
upload/128-firefox.png
Safari 3.1
upload/128-safari31.png
Opera9
upload/128-opera9.png

édit: en fait je suis un peu loin du rendu souhaité avec ce "empty cells" Smiley smile
Modifié par Igor (29 Aug 2008 - 21:25)
Didodu258 a écrit :
Avec une cellule vide, on peut régler l'espace vide en largeur. Est-il de même avec "empty-cells"?

On utilise empty-cells lorsqu'on a... des cellules vides. Donc ta question ne veut rien dire, empty-cells ne remplaçant pas une cellule vide mais servant uniquement à déterminer son rendu graphique (en gros, si j'ai demandé des bordures ou couleurs de fond pour mes cellules, le navigateur doit-il afficher une cellule vide avec couleur de fond et/ou bordure, ou cacher cette cellule vide?).