Discussion :

[Arkante]

Bonjour à tous,

Je suis embêté car un client me demande une structure en tableau et je n'arrive pas au rendu que je souhaite. Pour être plus précis ca marche sous webkit (Safari et Chrome) mais pas sous Firefox et Opera.

Voici le rendu:


Voici mon code (les styles sont à but démonstratif):

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
<table>
    <tr>
        <td style="background:red; width:100px">tata</td>
        <td colspan="2" style="background:blue; width:200px">tatatata</td>
    </tr>
    <tr>
        <td colspan="2" style="background:blue; width:200px">tatatata</td>
        <td style="background:red; width:100px">tata</td>
    </tr>
</table>

J'ai cherché et lu les standards et je ne trouve rien qui interdise cet usage mais je ne trouve aucun endroit ou quelqu'un l'utilise. Est-ce valide ? Comment faire fonctionner une telle structure ?

Merci d'avance pour votre aide.

[Bovino]

Le problème c'est que tu n'as que deux colonnes définies (2 td par tr) mais que tu gères l'affichage pour 3. Il y a donc une incohérence entre le balisage et l'affichage et dans ce cas, tu ne laisse au navigateur que le choix de se débrouiller tout seul. Ceci dit, je trouve que c'est bien Firefox qui répond le plus logiquement : le balisage est prioritaire sur l'affichage.

Je n'ai pas testé, mais tu pourrais essayer par exemple de créer une première ligne avec trois colonnes (et la cacher éventuellement) pour forcer l'affichage sur 3 colonnes. Ou mieux, utiliser des en-têtes, idéalement dans un thead.

[Arkante]

Merci bien, ca a corrigé mon soucis sur mon code test. C'est étrange car c'avait été ma première réflexion mais ca n'avait pas fonctionné sur la structure que je développe. Je regarde ca et te tiens au courant.

Bonne journée

EDIT: Je confirme que ca a bien solutionné mon problème. Merci