Rendering Difference Between Firefox and Chrome/Internet Explorer05 Nov 2013
I’ve discovered that this blog does not display the same between Firefox and Chrome and Internet Explorer. For some reason with Chrome and IE the <div>’s on the music page stagger their layout. I’m primarily a Mozilla Firefox user and performed all my testing with that browser. I’m looking into how to fix this and will post an update shortly with my solution.
Here is how it looks in Firefox:
And the not-so-good-looking Chrome:
Staggering I know…..
So the issue appears to be a
padding value within the CSS for the <span> that contain the images for the plus and minus images. Taking it from a value of
padding:9px 10px 10px 10px; resolved the issue. I not sure if my line height is causing the issue or if the iamges are too big for a span with that much padding…. Very odd.