0

My question is similar to this question

I want to remove the drop down menu at the top of the column headers, but then I also want to align the text of the column headers to the right side.

.ui-grid-header-cell {
 text-align: right;
}

Currently, when I try to do this, the carrot disappears, but there is still a blank on the right side of each column header. So the text is still not truly aligned to the right.

enter image description here

How do I make it so the carrot for the menu disappears and the column headers are pushed to the far right border without any additional space between the text and the columns border?

http://plnkr.co/edit/fa4JiMUIwtpLezYA4Fw5?p=preview

Community
  • 1
  • 1

2 Answers2

1

.grid-container{ 
       .ui-grid-icon-blank{
          display: none;
        }
    }
Ashish
  • 11
  • 2
0

Try this :

For right align both header text and cell text :

.ui-grid-header-cell .ui-grid-cell-contents {
    text-align:right;
}

Only for header text alignment try this :

.ui-grid-header-cell {
    text-align:right;
}

Working plnkr : http://plnkr.co/edit/1JenIGIepMWmnR1Ne5Dg?p=preview

Debug Diva
  • 26,058
  • 13
  • 70
  • 123
  • That is what I tried. Even in your answer you have the same issue. The header is not all the way to the right border there is a lot of white space –  Jan 24 '17 at 18:13
  • @user2719805 you can give `margin-right` property in `.ui-grid-header-cell` – Debug Diva Jan 24 '17 at 18:15
  • This still does not fix the issue –  Jan 24 '17 at 19:00