Absolute/Fixed div's in IE6?

position ‘fixed’ is not supported at all in IE6. Here is a javascript library that will fake it without any work on your part.

http://dean.edwards.name/IE7/

absolute positioning works in IE6 as far as I know. Maybe someone else will have some insight.

Update: It appears the project has moved to here: http://code.google.com/p/ie7-js/

(see http://dean.edwards.name/weblog/2008/01/ie7–2/ )

When you’re done with this problem, you can have fun checking out the Homer Simpson CSS.

From the original author:

It is not an image in the normal sense, it was instead painstakingly created using CSS. CSS (cascade style sheets) is a language to define a website visual representation, but it is not intended to create images. [The face] was created by placing hundreds of characters (numbers/letters/symbols) of different sizes and colors in specific positions on the page. Too easily see this, click somewhere in the middle of his face and slowly drag your mouse outward. You should see your mouse highlight some of the text!

Since this is an unusual and rather avant-garde method for displaying images, there are no tools and the process is hard, slow and complex to make it work well in different browsers.

Yay! It worked. It is kinda sluggish, but hey, they should update their browser!

That Homer Simpson CSS is indeed cool. It must have been a pain in the *ss making that.

@klaas, now you just gotta get your div to sit properly in Safari.

Hmmm, actually, it looks the same for me in both IE7 and Safari… the line of the div is at the bottom of the window, but the text contained isn’t visible (looks like it’s fallen off below the window frame).

Yeah maybe you saw me making some modifications, because this isn’t compatible with Bernie’s Better Animator Class, which I use to animate some things on the page. I had to use PHP code to hide some functions of the site to IE6-users, so maybe you saw that. :)

It’s all okay now, thanks to you all.

If anyone would like give a review on the design, please do! But make sure you’re using IE < 6, Safari, Firefox or Opera.

@rob, What exactly do you mean?

@klaas4
This is in Firefox on OS X. Notice the footer and the lack of scroll bar.
http://www.indielyrics.info/klass4.png

edit.. You have to hover to see it.

There shouldn’t be a scrollbar, because that’s all the content there is. Go to the info-page and you will see a scrollbar.

The footer slides out when you hover over it.

Can you maybe say which error was found by Firefox?

Now it isn’t giving an error. Are you playing with it right now?

And that is the Firebug extension.

And the error is back..
http://www.indielyrics.info/error.png

Oh, the function StartClock is only on 1 page, not in the index, but I have onload=“StartClock24()” in all my pages.

It should be gone now…

The error is gone now.

Is there some plugin like that for Safari too?

Not that I know of. Firebug is awesome and one of the only reasons I continue to use Firefox. If Firebug and Google Browser Sync worked in Safari I would switch.

Hmmm, I found this: http://www.hicksdesign.co.uk/journal/web-development-with-safari.
“defaults write com.apple.Safari WebKitDeveloperExtras -bool true” in terminal and then you have some tools…

@klass4: Don’t do that, the article no longer applies. Click on “Safari” in the menu bar, then “Preferences”, then “Advanced”, and check “Show develop menu in menu bar”. Good luck.

Thanks, that comes in handy!

Also, right click on a page element and choose “Inspect Element” while the develop menu is active. Brings up a neat console with a box model description, a list of applied styles, a network console and more. Very useful.