Title: SPAN code for angle font?
Last modified: August 31, 2016

---

# SPAN code for angle font?

 *  [laylalunn](https://wordpress.org/support/users/laylalunn/)
 * (@laylalunn)
 * [10 years, 3 months ago](https://wordpress.org/support/topic/span-code-for-angle-font/)
 * Hello!
 * I am trying to angle just one word on my the homepage of my blog.
 * I have used the span coding to change the colour, font size and font family (
   type), but can not find out if there is a code to angle the text – say 15 degrees.
 * Can anyone lend assistance?
 * Thank you

Viewing 1 replies (of 1 total)

 *  Moderator [cubecolour](https://wordpress.org/support/users/numeeja/)
 * (@numeeja)
 * [10 years, 3 months ago](https://wordpress.org/support/topic/span-code-for-angle-font/#post-7173363)
 * I’m not sure whether you want to skew or rotate the text (or possibly something
   else). Skewed and rotated text can both be achieved using css3 transforms which
   should work in up to date browsers.
 * To skew the font:
 *     ```
       <span style="display:inline-block;transform: skew(-15deg, 0deg); -webkit-transform: skew(-15deg, 0deg);-moz-transform: skew(-15deg, 0deg);-o-transform: skew(-15deg, 0deg);-ms-transform: skew(-15deg, 0deg);"Skewed Text</span>
       ```
   
 * To rotate the text:
 *     ```
       <span style="display:inline-block;transform: rotate(345deg);-webkit-transform: rotate(345deg);-moz-transform: rotate(345deg);-o-transform: rotate(345deg);-ms-transform: rotate(345deg);"Rotated Text</span>
       ```
   
 * Rather than use inline styles as above it would usually be preferable to instead
   add the CSS rules to a child theme stylesheet or using a custom styles plugin,
   then the transforms can be applied by adding a class to the span.
 * add these css rules to the stylesheet:
 *     ```
       .skew15 {
       	display:inline-block;
       	transform: skew(-15deg, 0deg);
       	-webkit-transform: skew(-15deg, 0deg);
       	-moz-transform: skew(-15deg, 0deg);
       	-o-transform: skew(-15deg, 0deg);
       	-ms-transform: skew(-15deg, 0deg);
       }
   
       .rotate15 {
       	display:inline-block;
       	transform: rotate(345deg);
       	-webkit-transform: rotate(345deg);
       	-moz-transform: rotate(345deg);
       	-o-transform: rotate(345deg);
       	-ms-transform: rotate(345deg);
       }
       ```
   
 * Then you can skew or rotate your text by applying the class to the span:
 *     ```
       <span class="skew15">Rotated Text</span>
       ```
   
 * or
 *     ```
       <span class="rotate15">Rotated Text</span>
       ```
   

Viewing 1 replies (of 1 total)

The topic ‘SPAN code for angle font?’ is closed to new replies.

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 1 reply
 * 2 participants
 * Last reply from: [cubecolour](https://wordpress.org/support/users/numeeja/)
 * Last activity: [10 years, 3 months ago](https://wordpress.org/support/topic/span-code-for-angle-font/#post-7173363)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics