Center angled text in CSS

See here for the original answer.

I was able to get it looking how you want by modifying the .front-person-titles>.t1 code to the following:

.front-person-titles>.t1 {
  right: 0;
  bottom: 0;
  -webkit-transform: rotate(-90deg) translateY(-100%) translateX(-7.5%);
  -moz-transform: rotate(-90deg) translateY(-100%) translateX(-7.5%);
  -ms-transform: rotate(-90deg) translateY(-100%) translateX(-7.5%);
  -o-transform: rotate(-90deg) translateY(-100%) translateX(-7.5%);
  transform: rotate(-90deg) translateY(-100%) translateX(-7.5%);
  -webkit-transform-origin: 0% 0%;
  -moz-transform-origin: 0% 0%;
  -ms-transform-origin: 0% 0%;
  -o-transform-origin: 0% 0%;
  transform-origin: 0% 0%;
}

You can see a working JSFiddle here.


Tags

  1. html (Private)
  2. css (Private)
  3. stack-overflow (Private)
  4. answer (Private)