Bulletproof CSS @font-face syntax

Let me introduce you to the best way to do your @font-face definitions. I’ll circle back to why this is the best possible solution but let’s first review the other techniques’ weaknesses. Of course, the problem at the center of this is that IE needs an .eot font, and the other browsers must take a […]

Simple Cross-Browser Transparency with CSS

Simple CSS code for Transparency setting for all browsers, IE, Firefox, Opera, Safari and Google Chrome…

CSS hacks & browser version detection – a new approach

How to target almost any browser from the server side using PHP. The workflow… Style everything for a web standards compliant browser like Firefox or Opera. Load an additional PHP file which outputs CSS styles with specific hacks. That’s it you’re done.

An Introduction to CSS 2.1 and CSS 3 selectors

An online demo showing examples of CSS 2.1 and CSS 3 selectors. Concise, to the point and useful future reference…

HTML 5 Reset Stylesheet

We’ve had a number of people asking about templates, boilerplates and styling for HTML 5 so to give you all a helping hand and continue on from those basic building blocks that Remy talked about last week, here’s a HTML 5 reset stylesheet for you to take away and use, edit, amend and update in […]

Free CSS Menus for Website Navigation

13 Styles is all about CSS menus. The menus are list based, very light-weight, easy to implement, and cross-browser compliant…

Advanced CSS Printing Using CSS Page Breaks

Here’s an article explaining how to make your pages printer-friendly by using CSS/XHTML page breaks. There are numerous spots that are good for page breaks: Between page sections (h2 or h3 tags, depending on your site format) Between the end of an article and subsequent comments / trackbacks Between longs blocks of content Using page […]

Vertically aligning text without the use of JavaScript

This is one of those really annoying CSS bugs that should be so simple to do but is actually fairly problematic because of old browsers like IE6. Vertical-align should be all that’s needed but nope, certain browsers like IE6 don’t support it so we need to do some wizardry to get it to work cross […]

5 Handy tips to fix space beneath floated elements

When two elements are floated in a div, chances are parent element no longer contains it because the float is removed from the flow. Here you’ll find five quick tips to fix this problem…

Prevent Your CSS and Javascript Files From Being Cached

Some websites use highly volatile, oft-changing CSS and javascript files. In the case of these files, it’s important that the developer prevent browsers from caching them. How do we do that? By using a phantom querystring, of course. We’ll use PHP to tack the current time onto the file reference. It’s a very simple technique […]

« Previous PageNext Page »