La classe de table ne peut pas être reconnue/lue en html/css

Question

J'ai une table qui est censée avoir une classe "table-class", mais la classe n'est même pas reconnue/lue et les propriétés n'apparaissent pas dans la table. J'utilise Azure appServiceEditor et lorsque j'exécute le code, la sortie est simplement une feuille de style par défaut, donc l'attribut class="table-class" n'est pas lu. Cependant, lorsque j'insère une autre classe au lieu de "Classe Table", les propriétés sont affichées. Je ne comprends pas quel est le problème.

.table-class {
  position: absolute;
  display: block;
  font-family: arial, sans-serif;
  border-collapse: collapse;
  z-index: 10000000;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 5%;
  color: white;
}

.table-class td,
th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

.table-class tr:nth-child(even) {
  background-color: rgba(0, 0, 0, 0.6);
}

<table class="table-class">
  <tr>
    <th>Company</th>
    <th>Contact</th>
    <th>Country</th>
  </tr>
  <tr>
    <td>Alfreds Futterkiste</td>
    <td>Maria Anders</td>
    <td>Germany</td>
  </tr>
  <tr>
    <td>Centro comercial Moctezuma</td>
    <td>Francisco Chang</td>
    <td>Mexico</td>
  </tr>
  <tr>
    <td>Ernst Handel</td>
    <td>Roland Mendel</td>
    <td>Austria</td>
  </tr>
  <tr>
    <td>Island Trading</td>
    <td>Helen Bennett</td>
    <td>UK</td>
  </tr>
  <tr>
    <td>Laughing Bacchus Winecellars</td>
    <td>Yoshi Tannamuri</td>
    <td>Canada</td>
  </tr>
  <tr>
    <td>Magazzini Alimentari Riuniti</td>
    <td>Giovanni Rovelli</td>
    <td>Italy</td>
  </tr>
</table>

Answer 1

.table {
  position: absolute;
  display: block;
  font-family: arial, sans-serif;
  border-collapse: collapse;
  z-index: 10000000;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 5%;
  color: white;
}

.table td,
th {
  border: 1px solid #dddddd;
  text-align: left;
  padding: 8px;
}

.table tr:nth-child(even) {
  background-color: rgba(0, 0, 0, 0.6);
}

  

    
Company
    
Contact
    
Country
  
  

    
Alfreds Futterkiste
    
Maria Anders
    
Germany
  
  

    
Centro comercial Moctezuma
    
Francisco Chang
    
Mexico
  
  

    
Ernst Handel
    
Roland Mendel
    
Austria
  
  

    
Island Trading
    
Helen Bennett
    
UK
  
  

    
Laughing Bacchus Winecellars
    
Yoshi Tannamuri
    
Canada
  
  

    
Magazzini Alimentari Riuniti
    
Giovanni Rovelli
    
Italy
  

Utilisez ce code au lieu de la classe de table