Quick solution when max-width isn't filling the element in Firefox.
A recent update on firefox change the way it handled max-width in css and meant that in some case the image no longer fills the element in which it resides (in my case a Joomla module).
Now I’m not an expert in CSS (far from it) but I wanted to share my simple solution for fixing max-width when used inline in html:
What I had was:
<img style="max-width: 100%; " src=“path/myimage.jpg" />
To fix the max-width not working in Firefox, I changed it to:
<img style="max-width: 100%; width: 100%; " src=“path/myimage.jpg" />
Do not ask me why. It makes no sense to me. I’m pretty sure the reason why the max-width broke is somehow to do with the putting it in an element with no width setting, but I’m a CSS noob. I put this here simply to help anyone fix this problem, I welcome anyone who wants to comment on better CSS and perhaps shed light on why this happens in the first place.
Meanwhile I hope this solution allows you to fill the element with your image using max-width CSS, it works for me.