CSS Hacks for Different Versions of Firefox

In a perfect world, we wouldn’t use CSS hacks. In the unpredictable, chaos of the real world, however, there are many situations where applying styles to particular browsers is indeed the optimal solution. Most of the time, we’d be targeting or filtering Internet Explorer because it is so incredibly awesome, but occasionally we need to tweak something in a modern browser like Firefox, Safari, or Opera. In this article, we’ll look at CSS hacks targeting different versions of Firefox…

VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

7 Essential CSS3 Techniques Revealed

There are several new and exciting functions and features being thought up for CSS3: text-shadow, box-sizing, opacity, multiple backgrounds, border-radius, border-image, etc.

This article presents 7 New CSS3 techniques that every web designer and developer should know. CSS3 will make complex effects easier to implement. Not all current browsers support CSS3 but there are workarounds that we can use for incompatible browsers…

VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

10 Professional Looking Free CSS Menus

Here are 10 attractive CSS menus that are ready to be used. In most there are CSS stylesheets ready to be downloaded directly from the site but a few are in tutorial format. For those you’ll be directed to the source website for you to complete the tutorial…

VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

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 browser. In this post I will talk about one lines and the more tricky wrapping of text…

VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

CSS text-shadow Fun: Realtime Lighting Demo

A post about the CSS text-shadow property. It’s been used to create some fun pseudo-realtime lighting effects.

There’s an example using a PNG to create a spotlight with some JavaScript to update the text-shadow style in order to simulate realtime shadows from a single light source. Works in Firefox 3.5, Safari, Opera, and Chrome but no support in IE8…

VN:F [1.9.22_1171]
Rating: +1 (from 1 vote)

Understanding CSS Image Opacity / Transparency

Image transparency/opacity is not yet a CSS standard. However, it works in all modern browsers, and is a part of the W3C CSS 3 recommendation. Here’s a nice clear tutorial that explains how to achieve cross-browser transparency. It’s easy to understand and there are some useful examples…

VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

Best Practices to optimize CSS – an academic exercise

Many of the tips in this article are tiny micro-optimizations, one thing to keep in mind when going overboard with optimizing. You should never sacrifice maintainability or extensibility for optimization experiments. Consider this article more like an academic exercise rather than real-life optimization tips.

It should also be noted that if you need to speed up your web site, don’t bother with CSS optimization. There are much better places to focus your attention to. The point of this and all optimization articles is to consider an optimization in context, not in isolation…

VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

Understanding CSS Absolute Positioning and Layering

It is possible for you to place an HTML element at a particular spot on your web page, independent of what is already there. In this article there’s an in-depth treatment of that topic.

You need basic knowledge in CSS and HTML (XHTML) in order to understand this article…

VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)

Weaving a better Web page with CSS frameworks

A Cascading Style Sheets (CSS) framework expedites and simplifies the design and development of Web pages. Moreover, a CSS framework produces more standardized results in all browsers. Here’s a look at two CSS frameworks, each with a unique philosophy: Blueprint and the Yahoo! User Interface (YUI) Grid.

Both frameworks are free to use and permute, according to the terms of the liberal Massachusetts Institute of Technology (MIT) License and Berkeley Software Distribution (BSD) License, respectively. This article explores the novelties and capabilities of each and works through a series of examples. You can choose the option that works best for you…

VN:F [1.9.22_1171]
Rating: 0 (from 0 votes)