HTML : bordures tableau

Gaetch

samedi 28 juin 2008 à 17:36

Bonjour j'aimerais que dans mon tableau, il y ait une bordure dashed entre les lignes, mais seulement à l'intérieur (pas de bordures sur le contour du tableau).

J'ai fait ça :
<table style="border-style:dashed" border="1" width="90%" frame="void" rules="rows" align="center">
mais ça met met des bordures autour (si j'enlève l'attribut style c'est bon les bordures sont où je veux mais pleines évidemment).

Je vais chercher un peu dans les tuto sur le net (pas la peine de m'en poster en réponse, je sais utiliser Google

) mais si quelqu'un a la solution cash comme ça se serait simpa de faire tourner ! Merci d'avance.

Ryo

samedi 28 juin 2008 à 17:57

Hello,

quelque chose comme ça ?

Code

<table width="90%" border="0" align="center">
      <tr>
          <td style="border-bottom:1px dashed #000000;">ligne 1</td>
      </tr>
      <tr>
          <td style="border-bottom:1px dashed #000000;">ligne 2</td>
      </tr>
      <tr>
          <td style="border-bottom:1px dashed #000000;">ligne 3</td>
      </tr>
</table>

y'a longtemps que je n'ai pas utiliser de table

Il est préférable d'utiliser les bloc <div> avec une feuille de style ccs

Edit : saloperie de mise en page

Gaetch

dimanche 29 juin 2008 à 00:14

Merci Ryo toujours là quand on a besoin ! Ca fait chier qu'il faille répéter pour chaque cellule. De plus j'ai finalement voulu mettre du dotted 3 px et ça me fait une séparation pour chaque colonne du coup les points sont coupés lol bref le chipote mais en tout cas merci à toi !

Méthylbro

dimanche 29 juin 2008 à 06:55

Utilise une image d'arrière plan sur tes lignes.

Ryo

dimanche 29 juin 2008 à 08:05

Citation (Gaetch @ dimanche 29 juin 2008 à 00:14)

Merci Ryo toujours là quand on a besoin ! Ca fait chier qu'il faille répéter pour chaque cellule. De plus j'ai finalement voulu mettre du dotted 3 px et ça me fait une séparation pour chaque colonne du coup les points sont coupés lol bref le chipote mais en tout cas merci à toi !

De rien. Oui c'est chiant de répèter, d'où l'intérêt d'utiliser les bloc div et un feuille de style en css.

En effet, toi quand tu veux changer par exemple le dashed en dotted, tu es obligé ici de le faire 3 fois.
Avec une feuille de style, tu le change qu'une seule fois dans la feuille de style. Sans changer ton code html.
Alors imagine si tu avais 50 lignes (bon c'est sûr il existe le chercher/remplacer

)

Dans ce cas, en html, tu remplaces :

Code

<table width="90%" border="0" align="center">
                    <tr>
                        <td style="border-bottom:1px dashed #000000;">ligne 1</td>
                    </tr>
                    <tr>
                        <td style="border-bottom:1px dashed #000000;">ligne 2</td>
                    </tr>
                    <tr>
                        <td style="border-bottom:1px dashed #000000;">ligne 3</td>
                    </tr>
              </table>

par ce code html

Code

       <div class="tableau">
                      <div class="ligne">
                              ligne 1
                      </div>
                      <div class="ligne">
                              ligne 2
                        </div>
                        <div class="ligne">
                              ligne 3
                        </div>
                    </div>

La feuille de style appelée par exemple style.css (dans la même racine ou pas) :

Code

     .tableau {
                // ceci est un commentaire
                    width:90%;                // largeur
                    text-align:center;    // alignement au centre -> équivalent à align="center"
                }
                .ligne {
                    text-align:left;
                    border-bottom:1px dashed #000000;     // 1 bordure en bas de 1px d'épaisseur de couleur noir
            }

Il y a bien un point devant tableau et ligne -> ça signifie que c'est une classe

Tu places ce code entre les balises <head></head> pour déclarer ta feuille de style:

Code

href-> indiquant le chemin vers ta feuille de style

Ce genre de code est plus apprécié que le tableau

Citation (Méthylbro @ dimanche 29 juin 2008 à 06:55)

Utilise une image d'arrière plan sur tes lignes.

Oui on peut ajouter des images d'arrière-plan
en css ça donne quelque chose comme ça:

Code

.ligne {
                  text-align:left;
                  border-bottom:1px dashed #000000;     // 1 bordure en bas de 1px d'épaisseur de couleur noir
                  background:#CCCCCC url(/images/images.jpg) center;     // image centrée sur un fond gris
          }

Edit : bon je laisse comme ça, j'arrive pas à aligner le code entre <code> et </code>

Gaetch

dimanche 29 juin 2008 à 13:55

Ho merci beaucoup à toi tu t'es défoncé... mais j'ai pas accès au CSS je crois c'est pour mon blog

Ryo

dimanche 29 juin 2008 à 18:38

Ah bah tant pis

joli blog au passage

Gaetch

lundi 30 juin 2008 à 00:39

merci merci

j'essaye de faire un truc simple et clair suis content si ça plaît!

g_roseline

lundi 30 juin 2008 à 00:44

Citation (Ryo @ dimanche 29 juin 2008 à 08:05)

En effet, toi quand tu veux changer par exemple le dashed en dotted, tu es obligé ici de le faire 3 fois.
Avec une feuille de style, tu le change qu'une seule fois dans la feuille de style. Sans changer ton code html.
Alors imagine si tu avais 50 lignes (bon c'est sûr il existe le chercher/remplacer

)

Voui mais le chercher/remplacer a hélas ces limites et ces petits bug de temps en temps...ça va que tu l'utilise sur une ou deux page (c'est rapide de vérifier que le taf a bien été fait) mais sur un site comme le mien...même si c'est bien utile et que je l'utilise souvent...je me demande parfois si je ne ferai mieux pas de tout changer à la mano, tant les corrections des oublis me prend du temps !!!!

Gaetch

lundi 30 juin 2008 à 02:24

G_Roseline > Et bien pourquoi tu n'utilises pas le CSS toi ?

Ryo

lundi 30 juin 2008 à 06:22

Citation (g_roseline @ lundi 30 juin 2008 à 00:44)

Citation (Ryo @ dimanche 29 juin 2008 à 08:05)

En effet, toi quand tu veux changer par exemple le dashed en dotted, tu es obligé ici de le faire 3 fois.
Avec une feuille de style, tu le change qu'une seule fois dans la feuille de style. Sans changer ton code html.
Alors imagine si tu avais 50 lignes (bon c'est sûr il existe le chercher/remplacer

)

Voui mais le chercher/remplacer a hélas ces limites et ces petits bug de temps en temps...ça va que tu l'utilise sur une ou deux page (c'est rapide de vérifier que le taf a bien été fait) mais sur un site comme le mien...même si c'est bien utile et que je l'utilise souvent...je me demande parfois si je ne ferai mieux pas de tout changer à la mano, tant les corrections des oublis me prend du temps !!!!

Le bloc-note bug souvent quand tu as un long fichier avec le chercher/remplacer

Utilise NotePad++

ou Dreamweaver, c'est comme ça que j'ai conçu mon site

g_roseline

lundi 30 juin 2008 à 10:29

c'est ce que j'ai fait.....je conçois mon site sur dream !!! mais tu sais il fait quasiment 2000 pages ce site, toute basée sur un modele similaire, alors, quand j'ai une connerie à changer, je fais un chercher/remplacer sur une centaine de pages...parfois meme sur tout le site.....du coup parfois...ça bugouille un peu !!!c'est normal je pense....

Ryo

lundi 30 juin 2008 à 16:29

Tout dépend comment tu as crée ton site, statique ou dynamique.

Apparemment tu as conçu un site statique

Vu que tu changes tout en chercher/remplacer.

Mon site doit contenir quelque chose comme 2 700 pages dynamiques, en fait je n'ai qu'une seule page en php qui
couplée avec une base de données, donc lorque j'ai une modif au niveau design à faire, je le fais en général dans la feuille de style,
puis une petite modif sur la page, et c'est tout

Un seule modif se répercute sur les autres pages.

D'où l'intérêt de la feuille de style, du php et une base de données.

Au fait sympa ton site g_roseline

Tout en noir j'adore

Gaetch

lundi 30 juin 2008 à 16:47

Pfa j'essaye je comprendre leur feuille de style mais je crois que j'aurais pas du sécher les cours de web j'y comprends pas grand chose. En fait je sais pas a quoi correspndent les éléments.

Code

body    {margin:0px;font-family: Arial, sans-serif;font-size:12px; background:#F3FEFF;color: #202E3A;}
a         { color:#01426F; }
a:hover { text-decoration:underline; color:#202E3A;}

#top    {
    border-bottom: 7px solid #62CBED;
    padding: 10px 10px 0 10px;
    color: #016AC3;
    margin-bottom: 3px;
    padding: 10px 10px 0 10px;
    font-size: 24px;
    font-weight: bold;
    text-align: left;
    }

#footer   {
    color: #62CBED;
    clear:both;
    padding: 5px;
    text-align:center;
    }

.contenuArticle {
    background-color: #E6FCFF;
    border-left: 15px solid #C8E7FF;
    border-bottom: 1px solid #E6FCFF; /* IE creepy text BUG FIX */
    }

.divTitreArticle h2 {
    border-bottom: 5px solid #269CFF;
    }
.titreArticle        { color:#269CFF; }
.titreArticle:hover    { color:#016AC3;}


.box-titre {
    border-bottom: 1px solid #F3FEFF;
    background-color:#62CBED;
    }

.box {
    background-color: #C8E7FF;
    border-bottom: 2px dotted #DDF2FF;
    }

.box-content {
    border-top: 5px solid #011FFF;
    }

.date     {color: #62CBED;}

.commentMessage  {
    border-left: 15px solid #E6FCFF;
    border-bottom: 1px solid #F3FEFF; /* IE creepy text BUG FIX */
    }
.commentOption   {
    border-bottom: 2px dotted #DDF2FF;
    color: #5FA3C5;
    }

.extraitArticle    {margin-top: 10px;margin-bottom: 20px;}

.extrait {margin-top: 2px;padding: 5px 5px 5px 15px;}
.plusExtrait {padding: 2px 5px 2px 5px;text-align: right;font-size: 10px;}
.plusExtrait a             { text-decoration:none; color:#016AC3; }
.plusExtrait a:hover    { text-decoration:underline; color:#01426F;}

#cl_1_1 { background-color: #C8E7FF; }

.pageContent {
    background-color: #E6FCFF;
    border-left: 15px solid #C8E7FF;
    border-bottom: 1px solid #E6FCFF; /* IE creepy text BUG FIX */
    }

.divPageTitle h2 {
    border-bottom: 5px solid #269CFF;
    }
.divPageTitle h2        { color:#269CFF; }
.divPageTitle h2:hover    { color:#016AC3;}

Gaetch

lundi 30 juin 2008 à 17:20

Oubliez le message d'avant ayé j'ai compris !
Donc maintenant j'essaye de remplacer mes mises en forme par du CSS.
Et donc pour en revenir au tableau, je voudrais savoir s'il est possible en CSS de définir une classe tableau où on aurait une mise en forme différente pour la ligne d'en-tête du tableau et le reste du tableau ?
Faut que ça ressemble à ça :

donc la première ligne en fond bleu et les autres avec une bordure basse bleue solid 1px. SAUF la dernière

J'émets toutefois des doutes quand à la possibilité de faire ça en CSS...

Ryo

lundi 30 juin 2008 à 17:35

ça donnerait ça Tableau Gaetch avec bloc div
t'as plus qu'à voir la source

la feuille de style utilisée est celle-ci

Edit :
Bon comme je m'emmerde et que je n'ai rien d'autre à foutre,
je t'ai mis le texte avec

Gaetch

lundi 30 juin 2008 à 20:23

Je m'incline et je te tire mon chapeau bien bas tu est trop indulgent avec moi en tout cas un très grand merci. Je vais mettre ça dans mon blog dès ce soir !

Ha oui en effet lol c'était une image que je t'ai donnée ça veut dire que tu t'es fait chier à retaper le texte rhoo t'assures trop !

Ryo

lundi 30 juin 2008 à 20:25

Citation (Gaetch @ lundi 30 juin 2008 à 20:23)

Je m'incline et je te tire mon chapeau bien bas tu est trop indulgent avec moi en tout cas un très grand merci. Je vais mettre ça dans mon blog dès ce soir !

Ha oui en effet lol c'était une image que je t'ai donnée ça veut dire que tu t'es fait chier à retaper le texte rhoo t'assures trop !

Euh non, copier/coller sur ton blog

As-tu compris les codes au moins ?

Gaetch

lundi 30 juin 2008 à 20:32

Oui j'ai compris, par contre je capte pas si y'a un quelconque moyen de spécifier la taille des colonnes ?

Ryo

lundi 30 juin 2008 à 20:38

En principe, la taille des colonnes va s'ajuster automatiquement à la taille du conteneur tableau
si tu as 2 colonnes, la largeur de tableau va être divisée par 2, etc ...

Mais tu peux toujours mettre cela,
si tu souhaites mettre 2 colonnes :

Code

.col {
             width:50%;
             float:left;
     }

Si tu en mets 3 : width:33%;
Si tu en mets 4 : width:25%;

mais bon ça t'oblige à changer à chaque fois

Gaetch

lundi 30 juin 2008 à 20:42

Oui et dans le code html y'a pas moyen de spécifier ça genre dans la balise div ? En fait ce serait pour faire des tableaux dans ce genre là avec une case toute petite devant (lien).

Mais bon, sinon au pire je crée une classe que j'utiliserai spécialement dans ce cas :

Code

.petiteCol {
width : 20px;
float : left;
}

Ryo

lundi 30 juin 2008 à 21:12

Hum pas sûr d'avoir tout compris

Un truc comme ça -> Tableau avec carré ?

Edit:
Tu vas devoir dans ce cas là définir une largeur pour col, ligne et sline

si tu veux des lignes de même longueur avec : largeur sline = largeur col - 2x 15px
15px étant défini ici -> padding: 0 15px 0 15px;

ça te donne un espace de 15px à gauche et à droite, à toi de voir pour la largeur exacte

g_roseline

lundi 30 juin 2008 à 21:44

Citation (Ryo @ lundi 30 juin 2008 à 16:29)

Tout dépend comment tu as crée ton site, statique ou dynamique.

Apparemment tu as conçu un site statique

Vu que tu changes tout en chercher/remplacer.

Mon site doit contenir quelque chose comme 2 700 pages dynamiques, en fait je n'ai qu'une seule page en php qui
couplée avec une base de données, donc lorque j'ai une modif au niveau design à faire, je le fais en général dans la feuille de style,
puis une petite modif sur la page, et c'est tout

Un seule modif se répercute sur les autres pages.

D'où l'intérêt de la feuille de style, du php et une base de données.

Au fait sympa ton site g_roseline

Tout en noir j'adore

merci !!! moi en effet c'est une construction statique...je ne sais pas encore faire les bases de données...par contre j'utilise les feuilles de styles !!! je me serais bien lancé dans la construction dynamique (ça doit pas etre bien compliquer à apprendre !), mais je n'ai que peu de contenu, mon contenu principal étant des photos...presque pas de texte...donc je n'en voyait pas l'utilité !!! mais peut être que je me trompe....il me reste tant à apprendre....

Ryo

mardi 01 juillet 2008 à 06:29

Bah tu peux créer une seule page php qui consulte ta base de donnée pour en extraire par exemple l'url de la photo à utiliser.

Moi en fait je ne possède qu'une seule page dessin-anime.php, qui en consultant la base de donnée, en extrait :
le titre du dessin animé, le titre du générique, l'image à afficher, le média à utiliser (vidéo ou audio), les paroles ...
de sorte qu'avec cette seule page j'en génère plus de 2 000 pages et avec le même désign

Blackmesa

mardi 01 juillet 2008 à 10:03

Php est très pratique quand on le sait maitriser. Déja, il rend ton site dynamique et en plus ca t'aide dans la gestion de ton site.
Comme l'a dit Ryo, avec une page php tu peux consulter ta base de donnée pour connaitre les url de photos.

Dans le cas contraire, tu peux faire une page php pour rentrer des urls dans ta base de données.

g_roseline

mardi 01 juillet 2008 à 12:00

en effet ça à l'air extremement pratique....etant donné que je dois créer encore moults sous-site...ça serait peut être bon de revoir la construction actuelle....mais dans mon site, sur chaque page on a la possibilité d'avoir des infos pratiques sur le lieu qu'on est en train d'explorer sous forme de pop-up...possible aussi avec ton systeme ? et par rapport au balise meta ? Chaque sous-site possedes ces propres balises, possible avec ton systeme ?les menus des mes sous sites sont tous differents, et ils sont en dhtml...possible ou pas ? et pour la version multilingue comment ça marche ? bref j'ai plein de questions !!!

Mon site est vraiment amené a se developper de manière enorme dans les mois qui arrive, c'est donc maintenant qu'il faudrait tout revoir....mais j'avoue ne rien y connaitre...des conseils à me donner ? des tutos à m'envoyer ? des bons sites qui vont m'aider? (waouuuuu ça rime, chui une poete !!!)

Gaetch

mardi 01 juillet 2008 à 12:11

Ryo ma question c'était, même si on utilise du CSS, on peut pas compléter dans le code HTML ? Genre faire <div class="truc" width="20%"> par exemple ?

Je suis pas sur le bon PC c'est pour ça que j'essaye pas moi même mais vais faire ça cet aprem.

Et oui donc comme pour l'instant j'ai pas deux tableaux pareils sur mes 4 je me demande si le CSS vaut le coup ?

Blackmesa

mardi 01 juillet 2008 à 12:44

pour g_roseline:
Consulte le site du zéro, qui proprose de très bon tutoriels sur le php. Après il y a beaucoup de questions dont je ne peux répondre immédiatement. Je ferais un deuxieme poste.

Pour gaetch:

le css c'est la base design de ton site, si ton design est inexistant ou trop superflu, ne t'attend pas a voir affluer les gens.

il ya deux modes pour le css:
le style externe avec les balises div: <div class="nom detaclassecss"> ne met rien apres le class="trucmuche".
dans ta page css externe tu mettre ainsi les caractéristique pour le style. Exemple

.tableau
{
width: 20;
color: green;

etc
}

sinon il y a le style interne, et je te conseille de consulter le site "siteduzero", dans la partie html/css où tu trouveras des informations sur le style interne.

Ryo

mardi 01 juillet 2008 à 16:42

Citation (Gaetch @ mardi 01 juillet 2008 à 12:11)

Ryo ma question c'était, même si on utilise du CSS, on peut pas compléter dans le code HTML ? Genre faire <div class="truc" width="20%"> par exemple ?

Je suis pas sur le bon PC c'est pour ça que j'essaye pas moi même mais vais faire ça cet aprem.

Et oui donc comme pour l'instant j'ai pas deux tableaux pareils sur mes 4 je me demande si le CSS vaut le coup ?

Non si tu mets <div class="truc" width="20%"> premièrement ton code n'est pas valide,
il peut donc se produire un bug d'affichage selon le navigateur web, et deuxièmement ça marchera pas

A toi de faire en sorte d'avoir le moins de travail

Il est préférable d'utiliser une feuille de style css, c'est ce qui défini le design et dissocie ton code html.
Par exemple, si tu souhaite changer de design, tu n'as juste qu'à changer la feuille de style sans toucher au code html, c'est ça l'avantage.

Je sais pas si je suis clair

Gaetch

mardi 01 juillet 2008 à 16:55

Okay bon c'est un peu de la baise alors (moi j'ai plusieurs sortes de tableaux en tête que je veux faire cohabiter lol) mais suis entrain de voir tout ça.

D'ailleurs merci Blackmesa (référence à Half-Life ?) pour ton site j'ai tout lu c'est achement bien fait !

Je peux poser une question con ? A quoi sert la balise <div> ? <p> fait exactement la même chose non ?

Ryo

mardi 01 juillet 2008 à 17:09

La balise <p> ou paragraphe permet le découpage du texte en ajoutant l'équivalent de deux retours chariot sur une machine à écrire ou d'un retour à la ligne suivi d'une ligne vide.

La balise <div> ou division sert à définir un bloc, en fait un site c'est un assemblage de bloc

qu'il faut placer

Tu peux utiliser la balise <div> pour faire la même chose qu'une balise <p> mais pas l'inverse

Essai les 2 tu verras la différences

Gaetch

mardi 01 juillet 2008 à 17:21

Ha oui nan exact autant pour moi

Hou pinaise ça m'inverve !
Bon je suis entrain de COMMENCER (on se moque pas) avec mon CSS et j'ai redéfini mes balises <h> pour les titres j'ai mis ça dans mon fichier CSS :

Code

body
{
font-family : "Trebuchet MS", Verdana, Arial, serif;
}

...

h6
{
font-weight : bold;
}

Ca veut pas dire que mes titres en h6 devrait être en Trebuchet MS taille normale et gras ? parce que là c'est pas le cas ils sont plus petits qu'un texte entouré de <strong></strong>

En fait, quand on définit des attribus pour une balise qui existe déjà, ça remplace pas la définition normale ??

Gaetch

mardi 01 juillet 2008 à 17:48

Autre question, je sais ça commence à faire beaucoup

comment faire en CSS pour dire que je veux pas de saut de ligne au début d'un paragraphe et pas de saut de ligne après un titre ?

Ryo

mardi 01 juillet 2008 à 17:54

Citation (Gaetch @ mardi 01 juillet 2008 à 17:48)

Autre question, je sais ça commence à faire beaucoup

comment faire en CSS pour dire que je veux pas de saut de ligne au début d'un paragraphe et pas de saut de ligne après un titre ?

Si tu utilises les balises <p> et <h> oublie cette demande

Passe par un div

Pour ton h6, vérifie que c'est bien le h6 du même conteneur

Gaetch

mardi 01 juillet 2008 à 18:06

J'ai du sauter l'histoire des conteneurs...

Et dans mon div je spécifie comment l'espacement avant et après ? Avec des padding ?

Ryo

mardi 01 juillet 2008 à 18:09

Tu devrais faire un tour ici -> CCS/xhtml

La base d'abord

Blackmesa

mardi 01 juillet 2008 à 18:11

body
{
font-family : "Trebuchet MS", Verdana, Arial, serif;
// la tout ton texte sera en police trebuchet Ms, ou verdana,etc, tout ton texte donc pas que les titre h6
}

...

h6
{
font-weight : bold;
font-family : "Trebuchet MS", Verdana, Arial, serif; // si tu le me la, et tu supprime ce qu'il ya dans le body, alors il n'y aura que les h6 qui seront de police trebucheet ms, ou verdana etc.

}

et puis, vois completement le cours sur le site que je t'ai passer. Il répondra a toutes tes questions

Gaetch

mardi 01 juillet 2008 à 18:17

Oui ben j'ai vu tout le cours lol j'ai passé toute l'aprem dessus j'ai même fait les petits questionnaires (j'ai eu 20 à tous d'ailleurs

) si je poste des trucs ici c'est que j'ai pas capté un truc.

Blackmesa

mardi 01 juillet 2008 à 18:32

alors relis, pratique, lis pour te corriger, pratiquer, corrige, lis. Ya que comme ca que tu y 'arriveras.

les balises <div></div> font un lien vers ta page css, ca ne sert qu'a faire un lien du block de texte entre les balises <div> a la page css qui la définira s'il y a un espacement, si le texte est en gras ou qu'elle sera sa police.

Ryo

mardi 01 juillet 2008 à 18:38

Citation (Ryo @ mardi 01 juillet 2008 à 17:54)

Pour ton h6, vérifie que c'est bien le h6 du même conteneur

Voilà ce que je veux dire

Exemple tu as un bloc nommé toto, et la dedans tu veux h6 :
.toto h6 {
}

en html:
<div class="toto">
<h6>mon titre au format h6</h6>
</div>

si tu ne mets que h6 alors il dépend de body

si tu reprends ta feuille de style, tu as un truc du genre:
.divTitreArticle h2 {
border-bottom: 5px solid #269CFF;
}
le h2 est appliqué au bloc divTitreArticle

Gaetch

mercredi 02 juillet 2008 à 01:58

J'ai trouvé en tatonnant

Ce que je voulais dire c'est que si je met que :

h6
{
font-width : bold ;
}

la taille de la police restera elle la taille définie par le navigateur pour les balises h6 donc si moi je veux que mon h6 soit de taille 1em (ce que je croyais normal si je met rien) il faut que je le précise.

Bon suis aux tableaux là ! Je voudrais que mon tableau soit centré (pas le texte dedans) et je trouve pas quelle propriété utiliser. C'est pas text-align ni vertical-align et y'a pas d'autres propriétés d'alignement suceptibles de faire ça

Ryo

mercredi 02 juillet 2008 à 06:29

dans ta classe tableau, rajoute :
margin:auto;

ça ajoutera des marges de chaque coté, en auto ça centre ton bloc

et pour ta balise h6, oui tu dois définir la taille du texte que tu souhaites

Sur ce j'y vais @ce soir

Gaetch

mercredi 02 juillet 2008 à 14:52

Danke shöne c'était ça que je voulais

Gaetch

mercredi 02 juillet 2008 à 15:14

Voilà ce que j'ai fait :

Code

table
{
    width : 90%;
    margin : auto;
    border-collapse : collapse;
}

table tr th, table tr td
{
    font-family : trebuchet ms, sans-serif;
    font-size : 10pt;
}

table tr th
{
    background-color : #62cbed;
    color : #ffffff;
}

table tr td
{
    border-top : 1px solid #62cbed;
}

Et donc après j'ai fait un test, en HTML je fais donc :

Code

<table>
    <tr>
        [color="#ff0000"][b]<th width="20%">Titre Col 1</th>[/b][/color]
        <th>Titre Col 2</th>
    </tr>
    <tr>
        <td>Bla A
        <td><div class="parStandard"/>AC/DC, Anaïs, Arctic Monkeys, Ben Harper, Camille, Cranberries, Deep Purple, Depeche Mode, Eminem, Evanescence, Francis Cabrel, Garbage, Genesis, Gorillaz, Gwen Stefani, IAM, Indochine, Jeanne Cherhal, Justice, Kate Bush, Keren Ann, Kylie Minogue, Lady Sovereign, Limp Bizkit, Linkin Park, Mademoiselle K, Madonna, Massive Attack,  MC Solaar, Melissa Mars, Michael Jackson, Muse, Mylène Farmer, Nightwish, Nine Inch Nail, OK Go, One-T, Pink, Placebo, Police, Portishead, Pravda, Prodigy, Puddle of Mudd, Queen, Queen of the Stone Age, Rage Against the Machine, Rammstein, Raoul Sinier, Rihanna, Rob Dougan, RPZ, Rufus Wainwright, Saïan Supa Crew, Samuel Barber, Scorpions, Sean Paul, Shakira, Shurik'n, Stabbing Westward, Supertramp, System of a Down, t.A.T.u., Telephone, Tété, Texas, The Hoosiers, The Killers, The Dø, TTC, Vangelis, Yael Naim, Yelle, Yes, Yuki Kajiura, Zazie</td>
    </tr>
    <tr>
        <td>Bla C</td>
        <td>Bla D</td>
    </tr>
    <tr>
        <td>Bla E</td>
        <td>Bla F</td>
    </tr>
    <tr>
        <td>Bla G</td>
        <td>Bla H</td>
    </tr>
</table>

Voilà ça marche j'ai le tableau que je voulais j'arrive même à justifier une cellule en mettant un div (est-ce que c'est bien ?) mais je voulais savoir si j'avais le droit de faire mon <th width="20%">Titre Col 1</th> pour définir ponctuellement une taille à ma colonne oui si ça se fait pas (sachant que ça marche). En fait je veux savoir si c'est de la "bonne programmation"

Blackmesa

mercredi 02 juillet 2008 à 16:20

c'est de la "bonne programmation" ^^'. Même s'il n'existe pas de mauvaise et bonne programmation, on parle surtout de code propre et lisible (indenté) ou de code pas propre et illisible (non indenté).

Il ya quand même une erreur.

Tout marche parce que dans le css, table (et tr,th,td..) n'ont pas besoin d'être défini par un div donc pas de "." .
Cependant, tu as mis un div (dans ton code html):

"<div class="parStandard"/>AC/DC, Anaïs, Arctic Monkeys, Ben Harper, Camille, Cranberries, Deep Purple, Depeche Mode, Eminem, Evanescence, Francis Cabrel, Garbage, Genesis, Gorillaz, Gwen Stefani, IAM, Indochine, Jeanne Cherhal, Justice, Kate Bush, Keren Ann, Kylie Minogue, Lady Sovereign, Limp Bizkit,..."

(déja tu n'as pas refermer la balise, une balise <div> doit ètre fermer par une autre balise </div>). ensuite dans ton code css, tu n'as pas mis la classe pour définir les caractéristiques du texte qui est entre les balises <div></div>. Ca marche parce que les caractéristiques sont définis par les <td></td><th></th>, etc.

par exemple dans ton code css, tu aurais du mettre:

.parStandard
{
color = red; (exemple)
}

sinon pour le <th width = "20%"> tu peux, mais tu peux aussi le définir dans ton code css.

Si tu n'as pas compris quelque chose n'hésite pas ^^'.

Gaetch

mercredi 02 juillet 2008 à 16:25

Ha wi exact j'ai oublié de refermer mon div !
Mais sinon j'ai pas mis tout mon code CSS j'avais défini la classe .parStandard plus haut :

Code

.parStandard
{
text-align : justify;
margin-bottom : 24px;
}

Merci ça me rassure alors je peux continuer tranquille

Ryo

mercredi 02 juillet 2008 à 16:28

Te vla pro du css

y'a plus ka

Gaetch

mercredi 02 juillet 2008 à 18:41

Ouais

Merci à vous beaucoup beaucoup en tout cas vous êtes bien patients !

Le CSS est mon ami

Blackmesa

jeudi 03 juillet 2008 à 11:01

pas de probleme ^^ et puis la programmation demande beaucoup de patience (ah oui pour corriger les erreurs et les bugs il en faut énormément -_-).

Ryo

jeudi 03 juillet 2008 à 11:51

Il faut aussi beaucoup de kawa (ou autres stimulant)

et aussi beaucoup de cheveux (moi je m'en suis arraché beaucoup)