css

Creating a Rollover Button without Javascript

JavaScript rollover buttons have been a common feature on the web for a long time now, but they do have some drawbacks. In the article below I will describe a way to make some neat looking rollover techniques with just XHTML and CSS. They aren't perfect for every situation, but they are an interesting alternative.

Why not just use MM_swapImage()?

Macromedia's (now Adobe's) ubiquitous JavaScript functions for rollovers are effective but they do have a few disadvantages:

Ever since I started making custom themes for Drupal, I kept running into a strange problem. If my theme or my content included a table, when I looked at it in Firefox the table would have a thin grey line on the top. I finally figured out what was causing this and I would like to share it with you.

If you want to skip the lecture, you can click here for the solution.

Update 2008-08-22: This page has received a large amount of traffic from people looking for implementations of the Blueprint CSS theme project. Here are some links to help out those people:

While making the first article in the "Mistakes I've Made" series. I immediately came across the fodder for the next. I was trying to create CSS for my code examples and discovered that using <pre /> just won't cut it anymore.

This is the first in a series of short articles called "Mistakes I've Made". In this series I plan to give examples of mistakes, misunderstandings, and problems I've encountered while coding. Maybe they will keep you from going through the same frustration.

I came across this "mistake" while making the new CSS for this site. Apparently, Internet Explorer only speaks American English. Here is the code I created: