18041 sujets

Questions générales et questions de débutants

Probleme de tableau

Bonjour ,
J'ai un site de test ,j'ai une page dans une iframe qui est chargée et une petite barre de progression qui disparait kan l'iframe est chargée le tout en Js bref
Dans ma page j'ai une photo et dessous un tableau avec une autre photo dans ce tableau

Ce tableau contient une colonne avec un tableau pour mettre plusieurs colonnes et donc articles et à coté une 2ieme colonne avec la photo
le soucis c'est que la colonne de gauche la 1ere a coté de la photo ne s'affiche pas il y a que la photo.....
pourtant tout me semble normal
Merci Smiley smile

Le lien de mon site de test
http://www.webtest.netau.net/index.php
Salut »

De toute façon tu as deux !DOCTYPE. Et deux fois la balise BODY
Tu n'est pas obliger de faire comme ça. Ce n'est pas recommandé disons.

..
ah d'accord ,j'ai supprimé le doctype et le body de l'iframe mais le probleme persiste en tout c as merci pour ces balises en trop
c'est bizarre mon code semble normal....
Salut »

Ton code est quelque peu faible.
Ce serais bien si tu reprenais ton code au complet. Voir si l'élément table est vraiment essentielle dans ce cas. Généralement non, on ne formate pas avec table. Ce n'est pas son rôle premier.

Dans ton exemple tu imbrique la balise <table> dans un <table>. Ce n'est pas une bonne pratique. Tu peux avoir plusieurs tables sur une page, mais sans imbrication.

Je te suggère beaucoup de bien définir ton projet avant. Ce sera utile. Tu peut sûrement utilisé d'autres éléments HTML, pour faire une mise en page en fonction de tes buts et objectifs.

Mais si c'est mieux pour toi d'utilisé <table> il serait mieux que tu en place deux côte à côte dans un DIV : un tableau pour les articles et l'autre pour la photographie.

Un exemple avec deux tableaux » Ce n'est qu'une suggestion : perso je ne ferais pas ainsi.

upload/20350-tableau.jpg

Évidemment ce n'est qu'un exemple » oubli pas que les tableaux peuvent devenir complexe et qu'il n'est pas toujours facile de maintenir une belle apparence.

Essais de définir exactement tes besoins, sur papier, et voir si il n'y a pas d'autres possibilités en CSS. En générale il y a toujours une meilleur façon, que l'utilisation des tableaux.

L'élément table exige une longue pratique pour bien maîtriser son contenu et son apparence.

..
Modifié par zardoz (16 Jul 2011 - 05:33)
Salutation »

À vrai dire tu n'as pas de réels problèmes Smiley smile

L'exemple sous capture a été fait à partir de ton source. Je n'ai que renseigné la zone en CSS.

upload/20350-zTableau01.jpg

C'est dû au fait que tu n'as pas renseigné visuellement parlant. De plus ton tableau imbriquer est vide de texte. Dans la réalité ton tableau est bien présent, seulement encore faut-il l'instruire pour un affichage en visuel, et le remplir de contenu.

Fait le entièrement en CSS, ne mélange pas les instructions CSS et les attributs HTML. C'est toujours mieux en CSS, pour un contrôle complet et aisé.

Avec des cellpadding et cellspacing à « 0 » ou encore aucun border ou background à tes cellules c'est sûr que tu ne verra pas en visuel. Place du contenu aussi, dans ton tableau imbriquer. Border et background étant facultatif ici.

Je te laisse le source : il est basic »


<style type="text/css">
 body {
  color:#333;
  font-family:sans-serif; 
  font-size:1em; 
  width:100%; 
  margin:0; 
  padding:0;
  overflow:auto;
 }
 table {
  width:400px; 
  border:2px solid #ccc;
  margin:2px;
 }
 .tableImbrique {
  border:2px solid #444;
 }
 td {
  background:#f5f5f5;
  vertical-align:top;
  font-size:0.8em;
 }
 img {
  width:340px;
  height:auto;
 }
 h1 {
  color:#ff0000;
  font-size:1.0em;
  line-height:0;
 }
 th {
  vertical-align:top;
  background:#ff0000;
  height:auto;
 }
</style>
</head>

<body>
<table>
  <tbody>
    <tr>
      <td>
      <table class="tableImbrique">
      <th>Articles</th><th>Auteur</th><th>Date</th>
          <tr>
            <td>
              Les paysages de Melbourne
            </td>
            <td>Fanny McField</td>
            <td>12-09-2011</td>
          </tr>
          <tr>
            <td>
             Le Web design et l'apprentissage
            </td>
            <td>Sophie Gagnon</td>
            <td>22-05-2011</td>
          </tr>
      </table>
      </td>
      <td>
       <img src="images/jpg/img_01.jpg" alt="Photo" title="Paysage de Melbourne" />
      </td>
    </tr>
  </tbody>
</table>


Mais je ne saurais quitter le topic sans te dire qu'une autre façon de faire : avec les DIV, c'est mieux. L'utilisation des tableaux t'obligera à des décisions solide avant toute écriture au clavier. Et ces décisions/réflexions sont nombreuses. Notamment à cause de la capacité de structure complexe avec l'élément TABLE. Intégration d'images, de titre et sous-titre et pourquoi pas de bref descriptions sur les articles à visiter.

On utilise l'élément TABLE pour des chargement de données massives. Si ce n'est pas ton cas, tourne toi vers le DIV H1 H2 H3 P et IMG : et les différentes approches techniques, pour contrôler cette zone.

..
Modifié par zardoz (16 Jul 2011 - 23:46)
alors merci beaucoup pour ce cours Smiley smile et merci de m'avoir consacrer ce temps.
Je vais exactement faire ce que tu me dis et utiliser des divs et css mais je fais tout ça dans le but d'apprendre
Merci bcp Smiley biggrin
Modifié par candice-shany (16 Jul 2011 - 21:08)
Sujet clos
Aller à