I recently finished reading CSS Mastery, and think I’ve finally got a good understanding of how absolute and relative positioning (fail to) work in Internet Explorer. I have been tinkering with this bit of code since yesterday afternoon, helping out a designer friend with his client’s site. However, we decided to go a slightly different route for their gallery. So, I pass it on to you with the hope that it proves useful.
Q: How many web designers does it take to change a lightbulb?
A: As many as possible – One to actually do the work, and all the others to sit around and say: “I could’ve done that better!”
Hot on the heels of last week’s article about creating time-sensitive CSS via PHP’s
date() format, I’ve whipped up another implimentation. Some people didn’t seem to comprehend what I was doing with the previous example, and one guy even cussed me out in the comments for using meta refresh instead of Ajax.
Inside the Lines
After the great feedback regarding my last article, I started thinking about the various ways that browsers handle
a:focus links. I decided to just whip up a quick example of differences between the major contenders. I was surprised to find that only Firefox behaves as expected, with the other popular ones offering their own interpretations.
Fixing the Fox
Update: If you want to retain the dotted border for tab-based navigation, apply this to
a:active. This still allows the indicator to appear when focused by keyboard, but hides when mouse activated. It’s the best of both worlds…
Quite some time ago, I had an argument with a friend who is a big fan of Microsoft products. While I’m no Xbox hater, I am not very fond of some of their more shoddy products such as Internet Explorer. He was justifying the shortcomings of IE6, saying that absolute positioning is rarely used in web pages, and that
:hover pseudo class is not really that useful.
For the most part, he was right. Very few websites I have seen actually make extensive use of absolute positioning. By default, if you do not specify a mode, web browsers will use static positioning.
Demo: See Example Here (View Source)
In the comments on my previous article about Em Image Sizing, it was noted that while that method works just fine, it makes images somewhat jagged and pixelated when sizing text up or down. In the comments, it was mentioned that styling Flash dimensions in Ems with CSS is also possible.
The thoughts and opinions expressed here are mine alone, and are not necessarily shared by any other living person.