Problème pour un tableau.

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Problème pour un tableau.

Message par Hilu le Jeu 22 Mai 2014 - 13:13

Bonjour à vous, j'ai un petit soucis pour faire un tableau dans un code, et j'espère pouvoir trouvé de l'aide ici.
Je fais un module pour mon forum (avancée pve pour WoW).
Voici le module :

Son code :
Code:
<span class="corners-bottom"><span></span></span>
<table style="width: 100%;" cellspacing="0" cellpadding="0" border="0">
   
   <tbody>
      <tr>
         
         <td style="height: 3px;">
            
         </td>
         
      </tr>
      
   </tbody>
</table>
<div class="module">
   
   <div class="inner">
       <span class="corners-top"><span></span></span>
      <div class="h3">
          Progression PvE
      </div><style type="text/css">
.siegeOfOrgrimmar
{
   background-image: url('http://imageshack.us/a/img163/1531/424d.png');
}
.raid
{
   border: 1px solid #FFFFFF;
   background-color: #DEDEDE;
   background-position-x: center;
   background-repeat: no-repeat;
   margin-bottom: 10px;
}
.raidHeader
{
   height: 36px;
   margin-bottom: 4px;
}
.boss
{
   background-repeat: no-repeat;
   color: #FF0000;
   height: 20px;
   line-height: 18px;
   margin-left: 10px;
}
.defeated
{
   color: #00FF00;
}
.normal
{
   background-image: url('http://img4.hostingpics.net/pics/119728verifiervertokicone850516.png');
   background-position: 85% 0%;
}
.heroic
{
   background-image: url('http://icons.iconarchive.com/icons/aha-soft/desktop-halloween/16/Skull-and-bones-icon.png');
   background-position: 95% 0%;
}
.nonheroic
{
   background-image: url('http://icones.pro/go.php?http://icdn.pro/images/fr/b/o/bouton-annuler-icone-7642-16.png');
   background-position: 95% 0%;
}

</style>
      <div style="margin: 10px;">
         
         <div class="raid siegeOfOrgrimmar" onclick="$('#siegeOfOrgrimmarBosses').toggle('slow')">
            
            <div class="raidHeader">
               
            </div>
            
            <div id="siegeOfOrgrimmarBosses" style="display: none;">
               
               <div class="boss defeated normal heroic">
                   Immerseus
               </div>
               
               <div class="boss defeated heroic">
                   Protecteurs déchus
               </div>
               
               <div class="boss defeated heroic">
                   Norushen
               </div>
               
               <div class="boss defeated heroic">
                   Sha de l'Orgueil
               </div>
               
               <div class="boss defeated heroic">
                   Galakras
               </div>
               
               <div class="boss defeated heroic">
                   Mastodonte d'acier
               </div>
               
               <div class="boss defeated nonheroic">
                   Sombre chaman kor'kron
               </div>
               
               <div class="boss defeated heroic">
                   Général Nazgrim
               </div>
               
               <div class="boss defeated">
                   Malkorok
               </div>
               
               <div class="boss defeated">
                   Butin de Pandarie
               </div>
               
               <div class="boss defeated">
                   Thok le sanguinaire
               </div>
               
               <div class="boss defeated">
                   Ingé-siège Boite-Noire
               </div>
               
               <div class="boss defeated">
                   Parangons des Klaxxi
               </div>
               
               <div class="boss defeated">
                   Garrosh Hurlenfer
               </div>
               
            </div>
            
         </div>
         
      </div>
      
   </div>
</div>

J'aimerai donc intégrer un tableau de façon à ce que une ligne s'affiche avec ("un nom"        "icone" icone") comme ici :

J'ai pensé à un tableau, car même si je modifie le background-position des icones, une seule d'entre-elles s'affiche.
Merci pour vos réponses.

P.S. : Je débute en codage, je n'ai que quelques petites base.


Dernière édition par Hilu le Jeu 22 Mai 2014 - 16:41, édité 1 fois

Hilu
Nouveau membre

Messages : 5
Inscrit(e) le : 20/05/2014

http://leswings.forumactif.com/
Hilu a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème pour un tableau.

Message par Arias le Jeu 22 Mai 2014 - 15:07

Bonjour,
Tu devrais structurer ton affichage avec un tableau plutot qu'avec des div.

Comme ca:
Code:
<table>

  <tr> <!-- ta premiere ligne -->
    <td> <!-- la premiere case de ta premiere ligne -->
      boss1
    </td>
    <td> <!-- la deuxième case de ta premiere ligne -->
      img NM
    </td>
    <td><!-- la troisème case de ta premiere ligne -->
      img HM
    </td>
  </tr>

<tr> <!-- ta deuxieme ligne -->
    <td> <!-- la premiere case de ta deuxieme ligne -->
      boss2
    </td>
    <td> <!-- la deuxième case de ta deuxieme ligne -->
      img NM
    </td>
    <td><!-- la troisème case de ta deuxieme ligne -->
      img HM
    </td>
  </tr>


ETC...

</table>



plutot que ton code qui est comme ca
Code:
<div class="boss defeated normal heroic">
                   Immerseus
               </div>
              
               <div class="boss defeated heroic">
                   Protecteurs déchus
               </div>
              
               <div class="boss defeated heroic">
                   Norushen
               </div>
              
               <div class="boss defeated heroic">
                   Sha de l'Orgueil
               </div>
              
               <div class="boss defeated heroic">
                   Galakras
               </div>
              
               <div class="boss defeated heroic">
                   Mastodonte d'acier
               </div>

Arias
**

Messages : 93
Inscrit(e) le : 19/05/2014

http://starcitizen-ddg.bbfr.net/
Arias a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Problème pour un tableau.

Message par Hilu le Jeu 22 Mai 2014 - 15:19

Merci du conseil, je vais tenté comme ça.

Hilu
Nouveau membre

Messages : 5
Inscrit(e) le : 20/05/2014

http://leswings.forumactif.com/
Hilu a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum