[résolu]Barre mulicolore en css

bonjour

je suis entrain de migrer un site...enfin disons un tas de tables vers du css. une des tableaux me poste un problème. Comment puis je reproduire le code ci dessous avec css? sans table je cherche depuis un moment mais comme je ne suis pas un pro, j ai du mal a trouver la meilleure solution.

Merci de votre aide

<table width="100%" height="10" border="0">
  <tr>
    <td width="26%" height="10" bgcolor="#990000">&nbsp;</td>
    <td width="5%" height="10" bgcolor="#CC0000">&nbsp;</td>
    <td width="13%" height="10" bgcolor="#990000">&nbsp;</td>
    <td width="19%" height="10" bgcolor="#996600">&nbsp;</td>
    <td width="7%" height="10" bgcolor="#990000">&nbsp;</td>
    <td width="30%" height="10" bgcolor="#996600">&nbsp;</td>
  </tr>
</table>

Modifié par bullshitski (24 Sep 2006 - 21:41)

Salut bullshitski et bienvenue sur le forum.

Pour répondre à ta question, je te propose la solution suivante : pourquoi ne pas affecter une classe à chque cellule et lui donner la couleur voulue ?
(selon toute vraisemblance, cela devrait fonctionner)

Mais bien sûr cela dépend aussi de l'utilisation que tu veux en faire pas la suite : peut-être serait-il plus judicieux de remplacer intégralement le tableau ...
Non ?

bonjour

Merci de ta réponse.J ai en fait mal formulé la question, je veux remplacer le tableau au complet par un div...ou des divs? La question étant de savoir comment le coder proprement en css

merci

Un petit billet à lire sur le blog d'alsa
Modifié par Bleeps (22 Sep 2006 - 19:20)

Bonjour bullshitski et bienvenue sur ce forum,

Afin d'en respecter les règles et d'en faciliter la lecture, pourrais-tu s'il te plaît éditer ton premier message, pour corriger sa mise en forme. En particulier, le code cité doit être entouré des balises [ code] et [ /code] (sans les espaces... et on peut aussi utiliser le bouton « code » dans les boutons de mise en forme du formulaire). Tu peux utiliser le bouton « éditer » en haut à droite de ton message. Merci d'avance.

bullshitski a écrit :
Merci de ta réponse.J ai en fait mal formulé la question, je veux remplacer le tableau au complet par un div...ou des divs? La question étant de savoir comment le coder proprement en css

Je pense que la question est au contraire bien formulée et tout à fait compréhensible... mais qu'elle est tout simplement mauvaise.

Partir d'un tableau pour se dire qu'on va faire un « équivalent » en div et CSS, c'est une erreur conceptuelle qui fait perdre beaucoup de temps dans l'apprentissage des CSS, et qui produit des choses assez catastrophiques. Comme le pointe le récent billet de Raphaël (lien donné ci-dessus par Bleeps), les deux stratégies de conception -- découpage en cellules de tableau vs utilisation d'élément sémantiquement pertinents et si besoin de divs -- sont différentes et incompatibles.

Pour dire les choses plus clairement : le tableau lui-même n'est pas le but à atteindre. Le tableau a été utilisé pour atteindre un but, à savoir réaliser une mise en page/intégrer une charte graphique. Il ne faut donc pas adapter le tableau en CSS, mais ré-intégrer la charte graphique en utilisant un contenu HTML sémantique et des feuilles de style CSS.

Plus concrètement, il faut procéder ainsi, aussi bien pour ton travail personnel que, le cas échéant (c'est à dire si ça coince trop), pour une demande d'aide sur le forum :
1. Quel est le résultat désiré ?
2. Quels sont les moyens envisageables ?

ok, merci pour ta remarque. j ai lu le billet et si je comprends bien, le tableau sert à faire des tableaux de données et le div a inclure un groupe d' éléments. Dans le ca présent, c est bien un div qui devrait être utilisé non?

Tant que tu ne dit pas ce que tu veux obtenir, on aura du mal à te répondre. Ce tableau, il sert à quoi?

bonjour

effectivement, voila l exempler:

http://schlogo.free.fr/test.html

On n'est pas très avancé on sait ce que tu as, mais pas ce que tu veux. Ce tableau, il est là pour quoi? Pour faire une mise en page? Afficher des données tabulaires?

c' est une décoration ca vient dans une page entre l entete et le contenu, ca ne contient rien à part les couleurs.

Dans ce cas, je ferais une bonne vieille image plutôt que de créer un div dans lequel seraient imbriqués des span

t as pas tort :-| C est le plus simple

Le Sujet serait-il [Résolu] ?

je me tate, j aimerais voir si quelqu un a une autre idée

Si ton image est purement décorative, le choix le plus judicieux et celui de l'inclure dans le fichier css au moyen de l'instruction background-image.
Voici pourquoi ... Merci la FAQ


Par conséquent, la solution qui t'a été proposée me semble être la meilleure...

Bonjour,

élasticité - fluidité du design ? Dans l'abstrait, beaucoup de réponses divergentes pourraient être apportées. Pour être efficient, il faudrait avoir le contenu sous la main, et pas seulement la petite ligne décorative qui doit s'insérer dedans...

Je ne comprends pas, je ne comprendrai jamais, et je refuse de comprendre comment on peut aborder la moindre question de présentation sans le contenu concerné

Sinon, moi, j'aime bien le tableau. Il est à la portée de celui qui en a le besoin; il est inoffensif, il se conjuge à une mise en page élastique...

Par contre, je n'aime pas du tout l'image si elle part du principe d'un design figé...

Mais j'ai dit cela, je n'ai rien dit (je crains que ce ne soit une chose dont il faille prendre l'habitude sur ce forum comme ailleurs)
Modifié par Laurent Denis (23 Sep 2006 - 09:53)

Salut,

En premier jet, j'aurais répondu comme Cygnus à condition que le design soit fixe.

Car tu ne nous précises pas le type de design que tu as adopté ...

Donc, il s' agit d' un tableau, purement décoratif, zéro contenu, le design étant fixe, je décide donc d' utiliser css avec background-image

Merci pour vos propositions et à Cygnus pour le lien sur les images

bullshitski a écrit :
Merci pour vos propositions et à Cygnus pour le lien sur les images

De rien...
C'était un plaisir