From the course: CSS Shorts

Unlock this course with a free trial

Join today to access over 22,600 courses taught by industry experts.

Set text on an angle

Set text on an angle - CSS Tutorial

From the course: CSS Shorts

Start my 1-month free trial Buy for my team

Set text on an angle

“

- [Chris] Hi, this is Chris Converse and in this episode, we'll use CSS transforms to rotate the text on a web page to match the angle of a background image. So if you'd like to follow along, download the exercise files and open the HTML file up in your favorite text editor. And once you have the HTML file opened, you'll see that we have a pretty simple layout here. There's a link to a style.css file which we'll be opening in a moment. Inside of the body area, we have a main article. And inside of the article element, we have a h1 and two paragraph elements. So what we're going to be doing is angling the entire article element so that all of the text on the page can be angled to match the background graphic. So to get started, let's open the style.css file from the exercise files. Let's scroll down. Let's find the article element. And the first thing I want to do is add a border to this so we can see what's going on. We'll remove this when we're done. So I'll type border, colon…

Contents