2010-10-08 13 views
0

Je code une classe Java qui génère des rapports de table HTML pour les tests JUnit et utilise CSS pour le formatage visuel. J'ai un problème d'alignement des cellules car le nombre de colonnes générées est imprévisible car certaines de ces colonnes représentent des paramètres passés dans une fonction variadique. Par conséquent, il y a un désalignement inhérent dans les colonnes. Est-il possible d'aligner ces cellules via un attribut CSS ou quelque chose? Je ne veux pas vraiment modifier le code Java sous-jacent pour changer ce problème esthétique.HTML Personnalisé Rapport JUnit Alignement de table inégal

Voici ce qu'un tableau d'échantillon généré ressemblerait à ceci:

http://lh5.ggpht.com/_N67DMbmmQMQ/TK6Q-Vlhd3I/AAAAAAAAAB8/JDFR1B5HX-k/JUnitReportExample.png

Voici la source HTML de la table (correctement formaté):

<html> 
    <head> 
     <style type="text/css"> 
      td 
      { 
       font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; 
       font-size: 1em; 
       border: 1px solid black; 
       padding: 3px 7px 2px 7px; 
      } 
     </style> 
    </head> 
    <body> 
     <table> 
      <tr> 
       <td> 
        <b>Method:</b> 
        <font color="blue" face="Verdana"> 
         testOne 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         1 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         1 
        </font> 
       </td> 
       <td> 
        <b>Result:</b> 
        <font color="green" face="Verdana"> 
         Passed 
        </font> 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <b>Method:</b> 
        <font color="blue" face="Verdana"> 
         testTwo 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         BMW 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         Audi 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         Mercedes 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         Porsche 
        </font> 
       </td> 
       <td> 
        <b>Result:</b> 
        <font color="green" face="Verdana"> 
         Passed 
        </font> 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <b>Method:</b> 
        <font color="blue" face="Verdana"> 
         testThree 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         21154423 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         2443 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         12121 
        </font> 
       </td> 
       <td> 
        <b>Result:</b> 
        <font color="green" face="Verdana"> 
         Passed 
        </font> 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <b>Method:</b> 
        <font color="blue" face="Verdana"> 
         testFour 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         4.1222 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         2.0001 
        </font> 
       </td> 
       <td> 
        <b>Result:</b> 
        <font color="red" face="Verdana"> 
        Failed 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <b>Method:</b> 
        <font color="blue" face="Verdana"> 
         testFive 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         10 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         10 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         Kungsholmens Hamn 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         Melissa Horn 
        </font> 
       </td> 
       <td> 
        <b>Result:</b> 
        <font color="green" face="Verdana"> 
         Passed 
        </font> 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <b>Method:</b> 
        <font color="blue" face="Verdana"> 
         testSix 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         Sweden 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         Sweden 
        </font> 
       </td> 
       <td> 
        <b>Result:</b> 
        <font color="green" face="Verdana"> 
         Passed 
        </font> 
       </td> 
      </tr> 
      <tr> 
       <td> 
        <b>Method:</b> 
        <font color="blue" face="Verdana"> 
         testSeven 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         Lisa Ekdahl 
        </font> 
       </td> 
       <td> 
        <b></b> 
        <font color="purple" face="Verdana"> 
         Lisa Ekdahl 
        </font> 
       </td> 
       <td> 
        <b>Result:</b> 
        <font color="green" face="Verdana"> 
         Passed 
        </font> 
       </td> 
      </tr> 
     </table> 
    </body> 
</html> 
</table> 
</body> 
</html> 
+0

Besoin d'un navigateur? – babtek

+0

Je veux qu'il soit rendu correctement dans au moins IE et Chrome. – TheWolf

Répondre

2

Je ne pense pas que vous sera en mesure de le faire avec CSS simple.

Vous ne voulez pas modifier votre code Java pour un problème esthétique, mais le problème est que votre table ne devrait pas avoir un nombre de colonnes qui change. Les colonnes de paramètres doivent être une seule colonne avec d'autres moyens pour séparer les valeurs. Vous pouvez générer une liste de paramètres séparés par des virgules dans la deuxième colonne. De cette façon, vous aurez toujours 3 colonnes et la chose sera beaucoup plus facile à formater correctement.

Si vous voulez vraiment conserver les valeurs dans des colonnes séparées, vous devez utiliser l'attribut colspan sur le dernier paramètre. Par exemple, la dernière colonne de paramètre pourrait ressembler à ceci, avec dans votre chaîne de java (ou tout ce que vous utilisez pour générer le code html) recherche un peu comme:

"<td colspan="+ (maxNumberOfColumns-currentColumnIndex) +">" 

Je vous suggère fortement que vous réglez le code java pour ce faire, comme les alternatives (en modifiant avec javascript) sont beaucoup plus douloureuses (même avec des choses comme JQuery).

+0

Oui, j'ai commencé à coder la logique pour stocker les lignes de Strings dans un tampon, puis les parcourir en ajoutant des cellules vides pour compenser le nombre impair de colonnes. Il semble que modifier le code Java est la seule solution. Merci pour votre suggestion. – TheWolf