Come centrare l'allineamento dell'intestazione della tabella?

Question

Tutti, Sto usando ng-table per la griglia. Sto usando lo snippet di codice seguente per impostare la colonna.

<td data-title="'Access ID'" sortable="'accessID'" style="width:120px" class="text-center">{{people.accessID}}</td>

Ma io non sono in grado di centrare allineare i dati di intestazione di colonna, ma colonna.

Ecco lo snippet del codice sorgente per Access ID Header.

<th ng-repeat="column in $columns" ng-class="{ 'sortable': parse(column.sortable), 'sort-asc': params.sorting()[parse(column.sortable)]=='asc', 'sort-desc': params.sorting()[parse(column.sortable)]=='desc' }" ng-click="sortBy(column, $event)" ng-show="column.show(this)" ng-init="template=column.headerTemplateURL(this)" class="header sortable"> <!-- ngIf: !template --><div ng-if="!template" ng-show="!template" ng-bind="parse(column.title)" class="ng-binding ng-scope">Access ID</div><!-- end ngIf: !template --> <!-- ngIf: template --> </th>

domanda è, come per centrare allineare l'intestazione per una determinata colonna in ng-tavolo?

Answer 1

table .text-center { 
    text-align: center; 
} 

JSFiddle http://jsfiddle.net/BrTzg/411/

Answer 2

È possibile utilizzare l'attributo header-class per impostare la classe per - avete indovinato - l'intestazione.

<td data-title="'Access ID'" sortable="'accessID'" style="width:120px" class="text-center" header-class="text-center">{{people.accessID}}</td> 

Answer 3

La risposta presentata dal @ OpenUserX03 è quasi perfetto, tranne che si deve avvolgere il nome della classe tra apici, in questo modo:

<td data-title="'Access ID'" sortable="'accessID'" style="width:120px" class="text-center" header-class="'text-center'">{{people.accessID}}</td> 

Answer 4

Ho usato per avere lo stesso problema come allineare sinistra le mie intestazioni di ng-table. sulla documentazione di ng-table non dice nulla né agli esempi.

ci sono due modi per fare questo il digiuno e più 'professionale'

modo veloce:

file aperti ng-table/dist/ng-table.css e ng-tavolo .min.css, in base al quale file css si utilizza. sulla prima riga gestisce l'intestazione,

.ng-table th { 
    text-align: center;/*just change that parameter to left/right*/ 
    -webkit-touch-callout: none; 
    -webkit-user-select: none; 
    -khtml-user-select: none; 
    -moz-user-select: none; 
    -ms-user-select: none; 
    user-select: none; 
} 

modo 'professionale': creare uno stile personalizzato e aggiungerlo al tuo file CSS sito web, in questo modo:

.table thead th { 
    text-align: left;/*change that parameter to left/right*/ 
} 

Speranza aiuta, in bocca al lupo.

Answer 5

Fix per ngTable

Per coloro che vedendo questo un anno più tardi. Nessuna delle soluzioni di cui sopra ha funzionato per me.Ho aggiunto ad un file CSS personalizzato:

.ng-table th { 
    text-align: center !important; 
} 

incentrato il contenuto nell'intestazione (vedi immagini)

Da questo:

a questo:

Answer 6

A chiunque abbia ancora questo problema, anche OP, dal momento che non ha ancora accettato una risposta, questo è il modo in cui lo faccio. nel tuo css (any .css)

table[ng-table] th { 
    text-align: left; 
    border-top: none; 
}