22 May

Just a Couple’a Fun Typography Links

Marcin Wichary made an incredible demo exploring "segmented type" as in, the kind you might see on a display like a microwave, but scaling up in complexity from there. "Datalegreya is a typeface which can interweave data curves with text." Airbnb commissions their own new font, Cereal (complete with hype video), and then talks about how they are rolling out usage. I wonder what the price tag is for work like this. Seems like it would be both

The post Just a Couple’a Fun Typography Links appeared first on CSS-Tricks.

22 May

Just a Couple’a Fun Typography Links

Marcin Wichary made an incredible demo exploring "segmented type" as in, the kind you might see on a display like a microwave, but scaling up in complexity from there. "Datalegreya is a typeface which can interweave data curves with text." Airbnb commissions their own new font, Cereal (complete with hype video), and then talks about how they are rolling out usage. I wonder what the price tag is for work like this. Seems like it would be both

The post Just a Couple’a Fun Typography Links appeared first on CSS-Tricks.

18 May

Foreword for CSS In Depth

Keith Grant recently released a brand new book on CSS: CSS in Depth. If you're looking for a book focused specifically on learning CSS, you've found it. I was happy to write the foreword for it, which I'll republish here.

"A minute to learn... A lifetime to master." That phrase might feel a little trite these days, but I still like it. It was popularized in modern times by being the tagline for the board game Othello. In Othello, …

The post Foreword for CSS In Depth appeared first on CSS-Tricks.

09 May

Where Lines Break is Complicated. Here’s all the Related CSS and HTML.

Say you have a really long word within some text inside an element that isn't wide enough to hold it. A common cause of that is a long URL finding it's way into copy. What happens? It depends on the CSS. How that CSS is controlling the layout and what the CSS is telling the text to do.

This is what a break-out text situation might be like:

The text hanging out of the box is a visual problem.

One …

The post Where Lines Break is Complicated. Here’s all the Related CSS and HTML. appeared first on CSS-Tricks.

09 May

Overriding Default Button Styles

There are a variety of "buttons" in HTML. You've got:

<button>Button</button> <input type="button" value="Button">

Plus, for better or worse, people like having links that are styled to match the look of other true buttons on the site

<a href="#0" class="button">Button</a>

One challenge is getting all those elements to look and layout exactly the same. We'll cover that a few ways.

Another challenge is getting people to use them correctly

This is a bit surprising to me — but I hear …

The post Overriding Default Button Styles appeared first on CSS-Tricks.

07 Apr

Keep Pixelated Images Pixelated as They Scale

This is a little reminder that there is a CSS property for helping control what happens to images as they scale up: image-rendering.

We're quite used to the idea that scaling an image larger than its natural size (upscaling) causes it to be blurry. As awful as that is, it's the browser doing the best it can to algorithmically smooth out an image over more pixels than it has data. But let's say you'd really rather not it do …

The post Keep Pixelated Images Pixelated as They Scale appeared first on CSS-Tricks.

28 Mar

On Paid Newsletters: An Interview With Adam Roberts of SitePoint’s Versioning

You don’t often think of email as something you pay to get. If anything, most people would pay to get less of it. Of course, there are always emails you like to get and opt into on purpose. We have a newsletter right here on CSS-Tricks that we really try to make worth reading. It’s free, like the vast majority of email newsletters. We hope it helps a bit with engagement and we make it worth doing financially by showing …

The post On Paid Newsletters: An Interview With Adam Roberts of SitePoint’s Versioning appeared first on CSS-Tricks.

28 Mar

On Paid Newsletters: An Interview With Adam Roberts of SitePoint’s Versioning

You don’t often think of email as something you pay to get. If anything, most people would pay to get less of it. Of course, there are always emails you like to get and opt into on purpose. We have a newsletter right here on CSS-Tricks that we really try to make worth reading. It’s free, like the vast majority of email newsletters. We hope it helps a bit with engagement and we make it worth doing financially by showing …

The post On Paid Newsletters: An Interview With Adam Roberts of SitePoint’s Versioning appeared first on CSS-Tricks.

15 Mar

​HelloSign API: Everything IT requires and Developers love.

(This is a sponsored post.)

We know that no API can write your code for you (unfortunately), but ours comes close. With in-depth documentation, customizable features, amazing support, and a dashboard that makes your code easy to debug, you won't find an eSignature product with an easier path to implementation. Or that's more liked by your team.

We wanted an API built by a team that valued user experience as much as we do. At the end of the …

The post ​HelloSign API: Everything IT requires and Developers love. appeared first on CSS-Tricks.

13 Mar

Chrome DevTools “Local Overrides”

There's been two really interesting videos released recently that use the "Local Overrides" feature of Chrome DevTools in order to play with web performance without even touching the original source code.

Umar Hansa: Improving the performance of Soylent.com with local overrides and font-display Harry Roberts: Using Chrome’s ‘Local Overrides’ to Test Performance Hypotheses

The big idea is that you can literally edit CSS and reload the page and your changes stick. Meaning you can use the other performance testing tools …

The post Chrome DevTools “Local Overrides” appeared first on CSS-Tricks.