CSS3 has some new values for sizing things relative to the current viewport size: vw, vh, and vmin. It is relevant to bring up now, because it’s shipping in Chrome 20 (canary at the time of this writing). And not behind a flag, it just works. Production usage isn’t quite there, but it will be soon enough.…
If you’ve ever used CSS transitions on structural elements on your page, you may have noticed a case where you see that transition happen when the page loads and is laying itself out. …
A series of inline-block elements with “normal” HTML formatting result in spaces between them when set on the same line. Here’s some techniques for fighting against the gap.
You probably already know you can make triangles with CSS. But what if you want to put a shadow behind it? Unfortunately the classic border trick doesn’t change the shape of the element, it’s just a visual trick. Let’s look at a couple alternative solutions.…
One little known feature of HTML5 is Scoped CSS. It’s an attribute for style blocks that may change the way we tackle certain styling challenges in the future.
This is a quick beginner-level overview of the different CSS position values. In a nutshell: relative allows you to "nudge" and leaves the element's original position in the page flow. Absolute and fixed allow for exact placement of elements and remove them from the page flow. Fixed positioned elements are unaffected by scrolling. All of them set a new positioning context and allow z-index to work.
Links from Video:
Dave and I were joined by Ian Stewart, a Theme Wrangler at Automattic for WordPress.com (he's probably thinking about WordPress themes right this very minute). We talked about WordPress multisite, training clients in WordPress, database syncing, team productivity, and more.
Jeremy Keith has a great article on his journey to allowing JavaScript to load in content based on the currently active media query. This allows you to keep media queries only in the CSS (DRY!).
The article was sans-demo, so I made one.
Dave and I were joined by Happy Cog front enders Jenn Lukas and Allison Wagner and we talk about coding styles, memorization, and the classic "what should we learn next?" This episode was sponsored by the online time tracking tool Harvest.
