Join James Williamson for an in-depth discussion in this video Adding kerning, part of CSS: Advanced Typographic Techniques.
Although we got the word to wrap within its parent…container it's not wrapping exactly where we need it to.…Now we're going to correct that and more closely match…the book covers spacing by adjusting the kerning in our title.…And this is what lettering JS is just made to do.…So I'm going to go back To my code editor, and…I'm working on the stacked.htm that's found in the 02_04 directory.…Now the first thing that I'm going to do, I'm going to scroll down a little bit.…And you're going to notice that I added, because I'm a nice…guy like that, I added a lot of individual selectors for you.…
Okay.…Now this is one of the joys and I got…to admit the pains of working with lettering JS because…it wraps each character in this main tag and then…numbers that with a class character one, two, three, four, five.…We have that ability to style this individually,…then the pain off course is that sometimes that…can be a little tedious here working with a word.…It has 11 characters in it and if we have 11 different things we want to do…
- Controlling font rendering with CSS
- Using web fonts
- Adjusting kerning
- Adding dimension to text
- Working with gradients and drop shadows
- Using 2D and 3D transforms
- Applying perspective
- Aligning split text
- Creating and triggering transitions
- Enabling animations
- Extending CSS with Lettering.js and Modernizr
Skill Level Intermediate
1. Getting Started
2. Using Lettering.js
3. Creating Dimensional Text
4. Creating Refracted Text
5. Animating Text
6. Using Modernizr
Additional resources2m 11s
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.