CSS-Tricks Screencasts

Latest Episodes:

#181: Poking at HTML Lists Apr 15, 2020

Show notes

I had a dumb little issue the other day where a nested list didn’t quite have the right spacing. I was only adding margin-bottom on the list elements and the lists themselves, but that meant there was no space between …

#180: Tinkering with Video on Mobile Apr 08, 2020

Show notes

Fair warning: I’m no expert on this stuff, I’m just playing around with video on the web and addressing some issues I have when showing off video clips in blog posts.

I have an iOS simulator up in this video, …

#179: A Grid of Squares Apr 06, 2020

Show notes

Using CSS grid to make a grid, is, well, the whole point. But what if you want all those grid items to maintain an aspect ratio, like a 1:1 square? It’s possible, but it involves a little trickery. In this …

#178: Percy Catches Visual Changes in any Workflow Nov 06, 2019

Show notes

I wanted to make sure you understand exactly what Percy can do for you, hence the title. When you commit a change to your websites Git repo, like in a Pull Request workflow most of us live in, Percy will …

#177: Local WordPress Development to Production Workflow Nov 04, 2019

Show notes

This is the basics of how I work locally with a WordPress site, and then getting it to production.

Flywheel is a sponsor of CSS-Tricks, and I’m glad they are because they make great products. Flywheel is at the heart …

#176: Working with Framer Motion Oct 28, 2019

Show notes

Matt Perry from Framer and I take a look at the React animation library Framer Motion.

First, we take a look at how simple the API is. You control everything very declaratively through props on elements in your JSX. …

#175: 7 Things to Know About Webflow Oct 10, 2019

Show notes

(This is a sponsored video I worked on between us at CSS-Tricks and Webflow. I think Webflow is a fascinating product for building websites that is, in my opinion, in a category all to itself at the moment. It …

#174: Using Local Overrides in DevTools Aug 08, 2019

Show notes

There is a feature of Chrome DevTools that lets you:

See the code of any given resource the current web page is using (like CSS and JavaScript).
“Pretty Print” it (format it for readability)
Save it to disk
Use that

…

#173: Ooooops I guess we’re full-stack developers now. Aug 07, 2019

Show notes

And by “we’re”, I mean us, front-end developers ;)

Here’s the website that goes with this talk.

This is a talk I put together where I postulate that, over time, the breadth of what front-end developers are able to do …

#172: Hand SVGing a Curved Line Aug 06, 2019

Show notes

I find that 98% of all my SVG usage comes from pre-created SVG files or vector art in some design software that I ultimately export as SVG. Not super often am I hand-manipulating the coordinates of things in the SVG …

Our TOPPODCAST Picks

Follow Us

Stay Connected

Related Podcasts

Links

Stay Connected