New kid on the block.

Code, Tutorials November 6, 2008

Not new as “moved here just yesterday”, but still new compared to other contenders: FireFox 3.

With it, a shifting of any web developers frustration came along: hacking FireFox 2.

What worked just fine in FireFox 2 does not necessarily work under FireFox 3 - several calls from customers dribbled in quite soon after the release. Later, the new situation became clear: if you now develop under FireFox 3 you will run into problems under FireFox 2 and of course, IE 7 and IE 6.

It used to be that FireFox 2 was the basis for me when developing and from there I’d go and make minor adjustments for other browsers. But this no longer works. Now, FireFox 3 is the basis - and suddenly hacks which will address ONLY FireFox 2 are needed.

This #wrapper example show how you can address FireFox 2 (and other various browsers) :

#wrapper {				/* this is what goes for the majority */
	position:relative;
	top:-14px;
	margin: 5px auto;
	text-align:left;
}

#wrapper, x:-moz-any-link {		/* hack for FF2 */
	top:0px;
}
#wrapper, x:-moz-any-link, x:default {	 /* restore for FF3 and later */
	top:-14px;
}

html*#wrapper {
	 top: 0px; 			/*for safari*/
	 *top: -19px;			/*for IE7*/
	 _top: -20px;			/*for IE6*/
}