Rendering issues under Firefox

Question

Under Chrome this is like this and how it is suppose to be :

However under firefox it goes like that :

Here is a link to see it link

Does someone has any link to a page where are explained the differences between navigators and their fixes ?

Answer 1

Replace max-width: 70% by width: 70% in this selector :

#miniMenu img { width: 70%; }

See this post on SO explaining issue on Firefox with max-width property : Image mysteriously ignoring max-width in Firefox & IE

Especially theses lines from @Boris Zbarsky answer :

You have max-width: 100%, but 100% of what? Of the parent width, right? But the parent is an inline-block (with class="sponsor") whose width is not set, so its width depends on the children, and in particular on the preferred width of the children.

The layout of this styling is undefined in the CSS specification. In particular, the intrinsic width of the kids in this case depends on the width of the parent which in turn depends on the intrinsic width of the kids. See http://www.w3.org/TR/CSS21/visudet.html#shrink-to-fit-float for the relevant spec text and note all the "does not define" bits.