When it comes to cross browsing testing, webdesigners usually fear the moment they must open up their beautifully designed website in Internet Explorer 8 or lower. Though nothing has changed there, this quick tip will focus on a firefox bug I recently encountered.
For one of my websites, I wanted a horizontal navigation menu where the <li> elements fell inline next to each other, no margin’s between them. Easy you’d say, just put the margins to 0. Correct, but for some reason, in firefox, there always remained a gap between them.
The solution, it seemed was quite simple, in stead of doing it the readable way and put each <li> element on a seperate line, you must also write the code inline, with no spaces in between. It seems that if you put them on different lines, firefox automatically adds a margin of its own.
So your code would be something like
<nav> <ul> <li>link one</li><li>link two</li><li>link three</li> </ul> </nav>
A real life example can be viewed on this site.