Richten Sie thead mit td in tbody

Question

aus Ich habe Probleme, die thead mit der td in tbody auszurichten. Ich habe versucht, die thead mit display: table-header-group;. Ich habe auch von hier herausgefunden: Why isn't padding applied to table elements?, das Padding funktioniert nicht auf 'table-header-group'. Also, wenn ich versuchte, padding-left zu meinem th über CSS zu liefern, passiert nichts. Ich habe auch versucht, mehr <th></th> vor meinem <th>Quantity</th> <th>Amount</th> <th>Total</th> zu verwenden, so dass "mehr Platz" hinzugefügt wird. Ich bin jedoch immer noch nicht in der Lage, das Thead mit meinem Inhalt in tbody in Einklang zu bringen.

Kann jemand dieses Problem beheben? Bitte lassen Sie mich wenn möglich auch wissen, wenn ich die Dinge nicht richtig mache. Jede Hilfe wird sehr geschätzt. Vielen Dank!

Screenshot und Code ist unten angegeben: thead is too left

Hier ist mein Code:

<div class="table-responsive col-lg-12 " ng-show="ngCart.getTotalItems() > 0"> 
<table class="table-responsive table-striped ngCart cart summaryTable " > 
    <thead > 
    <tr cellpadding="10"> 
     <th>Item</th> 
     <th>Quantity</th> 
     <th>Amount</th> 
     <th>Total</th> 
    </tr> 
    </thead> 
    <tfoot> 
    <tr ng-show="ngCart.getTax()"> 
    <td></td> 
     <td></td> 
     <td>Tax ({{ ngCart.getTaxRate() }}%):</td> 
     <td>{{ ngCart.getTax() | currency }}</td> 
    </tr> 
    <tr ng-show="ngCart.getShipping()"> 
    <td></td> 
     <td></td> 
     <td>Shipping:</td> 
     <td>{{ ngCart.getShipping() | currency }}</td> 
    </tr> 
    <tr> 
     <td></td> 
     <td></td> 
     <td>Total:</td> 
     <td>{{ ngCart.totalCost() | currency }}</td> 
    </tr> 
    </tfoot> 
    <tbody> 
    <tr ng-repeat="item in ngCart.getCart().items track by $index"> 

     <td>{{ item.getName() }}</td> 
     <td>{{ item.getQuantity() | number }}</td> 

     <td>{{ item.getPrice() | currency}}</td> 
     <td>{{ item.getTotal() | currency }}</td> 
    </tr> 
    </tbody> 

</table></div> 

Answer 1

was hast du richtig war. Alles, was Sie brauchen, ist die Textausrichtung Ihres Themas zu zentrieren. oder einfach den tbody nach links ausrichten.