<th align '"center"> arbeitet nicht an einer Bootstrap-Tabelle. Was könnte der Grund sein?

Question

Ich habe eine Bootstrap-Hover-Tabelle und ich versuche, die Spaltenüberschriften an die Mitte mit <th align="center"> auszurichten. Dies scheint keinerlei Auswirkungen auf die Tabelle zu haben, aber <td align="center"> funktioniert einwandfrei.

Dies ist mein Code:

<table class="table table-hover"> 
    <thead> 
    <tr> 
     <th>Title</th> 
     <th>Score</th> 
     <th align="center">Product</th> #This line is not working 
     <th>Who Reviewed</th> 
     <th>When</th> 
    </tr> 
    </thead> 
    <tbody> 
    {% for review in object_list %} 
     <tr> 
      <td><a href="{% url 'backend_reviews_edit' review.pk %}">{{review.title}}</a></td> 
      <td align="center">{{ review.score }}</td> 
      <td align="center">{{ review.product.title }}</td> 
      <td>{{ review.reviewer_name}}</td> 
      <td>{{ review.date_created|date:"m-d-Y" }}</td> 
     </tr> 
    {% endfor %} 
    </tbody> 
</table> 
    </div> 

Answer 1

Wenn Sie Bootstrap verwenden, seine CSS-Regeln verwenden.

<th class="text-center">Product</th> 

Answer 2

verwenden

<th class="text-center">Product</th> 

align-Attribut nicht, weil auf Bootstrap Sheet arbeiten finden diese:

th { 
    text-align:left 
}