A really interesting tutorial that uses CSS3 to make forms more usable…
Direct link: Enhance Required Form Fields with CSS3
Category Archives: Tutorials
Fighting the Space Between Inline Block Elements
Formatting links as a series of inline-block elements is an easy way to center align stuff e.g. a navigation menu. There’s one annoying issue and that’s the blank spaces that appear between elements. This article has several code examples that will remove the blank spaces from inline-block elements…
Direct link: Fighting the Space Between Inline Block Elements
CSS Hexagon Tutorial
A tutorial describing how to create CSS Hexagons with step-by-step instructions…
Direct link: CSS Hexagon Tutorial
CSS Regions
CSS regions allow content to flow through multiple elements allowing you to modify the standard flow of content and affect how content is grouped and displayed…
Direct link: CSS Regions
Pure CSS Clickable Events Without :target
All about CSS-only click events using just the :target method and no JavaScript. There’s a lot of cool stuff you can do with this method…
Direct link: Pure CSS Clickable Events Without :target
What’s the Deal With Display: Inline-Block?
One interesting alternative to floats that people are turning to more and more lately is to set the display value of an element to inline-block. What does this do exactly? How is it like a float? How is it different? Let’s dive in and see what we can discover…
Direct link: What’s the Deal With Display: Inline-Block?
Pragmatic, practical font sizing in CSS
An explanation of double-stranded heading hierarchy. This is the practice of defining a class every time you define a heading in CSS to allow for greater control of your typography…
Direct link: Pragmatic, practical font sizing in CSS
Another CSS image replacement technique
A new image replacement technique was recently added to the HTML5 Boilerplate project. This post explains how it works and how it compares to alternative image replacement techniques…
Direct link: Another CSS image replacement technique
CSS3 breadcrumbs
Breadcrumb navigation allows visitors to easily navigate through a site’s hierarchical structure. Here’s a tutorial with a few examples of CSS breadcrumb menus…
Direct link: CSS3 breadcrumbs
Places It’s Tempting To Use Display: None; But Don’t
A great article detailing why you should avoid using display:none in your CSS to make sure content is accessible for all visitors…
Direct link: Places It’s Tempting To Use Display: None; But Don’t