Question

I have wrapped some header into two line using this.

.slick-column-name { white-space: normal; }

.slick-header-column.ui-state-default{ height:30px; vertical-align:middle;}

But the single line headers stays on top of the cell. Is there any way to vertically align these “single line” headers into center?

Answer 1

Did you mind like this:

.slick-column-name { white-space: normal; display: table-cell; vertical-align:middle; height: 100px; background: red;  }

.slick-header-column.ui-state-default{ height:30px; line-height:30px; }

Here the demo: http://jsfiddle.net/xJUMv/