Author Topic: Headers text rotate  (Read 2718 times)

nniicc

  • Newbie
  • *
  • Posts: 2
    • View Profile
Headers text rotate
« on: September 04, 2015, 02:24:09 pm »
Hi,

im using a grid(3.0) with column grouping and i'd like to know if its possible to rotate the 2nd headers 90° so the text are upright, example grid:



is it possible to this with the api or by changing some css?

How i'd like it:
« Last Edit: September 04, 2015, 02:25:41 pm by nniicc »

paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6210
    • View Profile
Re: Headers text rotate
« Reply #1 on: September 08, 2015, 04:59:27 pm »
It can be done with help of css transform rule.

.pq-grid-col-leaf > div{
    -ms-transform: rotate(xdeg); /* IE 9 */
    -webkit-transform: rotate(xdeg); /* Chrome, Safari, Opera */
    transform: rotate(xdeg);
}

nniicc

  • Newbie
  • *
  • Posts: 2
    • View Profile
Re: Headers text rotate
« Reply #2 on: September 08, 2015, 05:04:08 pm »
Hey, yes i have already tried the transform css rule, but then only rotates the texts, since some will be longer then others the text will not be visible for display



Thanks for the answer but i would need to change the height for the 2nd row headers so all the text would fit without any line breaks