Search code examples
angularjsngtable

How can I display the sorting icons from ng-table on the left of the title column?


i have a table with many columns so i want to display the sorting icons on the left side of the title of the column, because lets say if one column title has 2 words in it, it will break word and the sorting icons will be at the right of the second word, and if the second word is smaller than the first word (ex: Bussiness Unit) all the header is ugly.

http://codepen.io/anon/pen/rMXBgP

 { field: "name", title: "Looooonggg header", sortable: "name", show: true }

Solution

  • ng-table.scss sets

    .sort-indicator {
        padding-right: 18px;
        position: relative;
        ...
    }
    

    Seeing that sort-indicator is a span my guess is someone forgot to add

    display: inline-block;
    

    All you need to do is add the rule

    .ng-table th.sortable .sort-indicator {
        display: inline-block;
    }
    

    somewhere in your custom css and that will solve your problem.