JSFiddle - React, Tailwind, and code Playground

HTML

<div id="box1">
    <p>2014</p>
</div>

<div id="box2">
    <p>2014</p>
</div>

CSS

div {
    width: 100px;
    height: 100px;
    border: 1px solid gray;
    margin: 15px;
}
/* applies to p elements in both boxes */
p {
    margin: 0px;
    background-color: olive;
    transform: rotate(-45deg);
    text-align: center;
}

/* applies only to p within box2 */
#box2 p {
    background-color: cyan;
    transform: translate(-25px,20px) rotate(-45deg);
}
/* notice that we are doing translate and rotate at the same
time */