Firefox image scaling in tables

Ryan · Mar 8, 2008

X-No-Archive: Yes

http://rh.freeshell.org/test.html

When I load this page in IE, Opera, or Safari, I get the result I
expected - all 9 smileys appear on the page, scaled up (or down) to
fit 100% of the current window size. You can see all 3 rows. If you
resize your window, it scales.

But, in Firefox, I only see the first two rows, and need to scroll
down to see the last row.

Is there a way I can make Firefox behave like the other browsers?

Jukka K. Korpela · Mar 8, 2008

Scripsit Ryan:

X-No-Archive: Yes

So you don't want people to see your original question in archives, only
the answers, which may or may not repeat essential information about the
problem.

Thanks for the clue. I almost started wasting my time on your problem.

Ryan · Mar 8, 2008

So you don't want people to see your original question in archives, only
the answers, which may or may not repeat essential information about the
problem.

OK, here it is again, to be archived for all time, long after the URL
gives a 404.

Your help would be appreciated.

~

http://rh.freeshell.org/test.html

When I load this page in IE, Opera, or Safari, I get the result I
expected - all 9 smileys appear on the page, scaled up (or down) to
fit 100% of the current window size. You can see all 3 rows. If you
resize your window, it scales.

But, in Firefox, I only see the first two rows, and need to scroll
down to see the last row.

Is there a way I can make Firefox behave like the other browsers?

Ryan · Mar 8, 2008

So you don't want people to see your original question in archives, only
the answers, which may or may not repeat essential information about the
problem.

OK, here it is again, to be archived for all time, long after the URL
gives a 404.

Your help would be appreciated.

~

http://rh.freeshell.org/test.html

When I load this page in IE, Opera, or Safari, I get the result I
expected - all 9 smileys appear on the page, scaled up (or down) to
fit 100% of the current window size. You can see all 3 rows. If you
resize your window, it scales.

But, in Firefox, I only see the first two rows, and need to scroll
down to see the last row.

Is there a way I can make Firefox behave like the other browsers?

Ben C · Mar 8, 2008

X-No-Archive: Yes

http://rh.freeshell.org/test.html

When I load this page in IE, Opera, or Safari, I get the result I
expected - all 9 smileys appear on the page, scaled up (or down) to
fit 100% of the current window size. You can see all 3 rows. If you
resize your window, it scales.

But, in Firefox, I only see the first two rows, and need to scroll
down to see the last row.

Is there a way I can make Firefox behave like the other browsers?

You're better not to use a table. Firefox is allowing the percentage
width on the images, but not the percentage height, and preserving
their aspect ratio.

This is correct behaviour-- percentage heights of auto height containers
are supposed to be ignored. The table-cells have auto heights.

You could do it like this instead:

<style type="text/css">
html, body
{
width: 100%;
height: 100%;
margin: 0;
padding: 0;
}
img
{
width: 33%;
height: 33%;
float: left;
}
</style>

<body>
<img src="1.png">
<img src="1.png">
<img src="1.png">
<img src="1.png">
<img src="1.png">
<img src="1.png">
<img src="1.png">
<img src="1.png">
<img src="1.png">
</body>

Jonathan N. Little · Mar 8, 2008

Ben said:
You're better not to use a table. Firefox is allowing the percentage
width on the images, but not the percentage height, and preserving
their aspect ratio.

This is correct behaviour-- percentage heights of auto height containers
are supposed to be ignored. The table-cells have auto heights.

Also OP's page triggered quirks mode being pseudo-xhtml so all bets on
rendering consistency were off!

Ryan · Mar 8, 2008

You could do it like this instead:

Thank you! That is exactly what I was trying to figure out.

Specifying 100% image scaling	11	Jan 14, 2007
Script working in Firefox but not Chrome and Safari	3	Apr 6, 2021
HTML5 in Firefox and other browsers	1	Aug 24, 2012
Overriding browser image auto-scaling	6	Oct 29, 2003
Im having trouble containing a title an image and a button	2	Oct 26, 2022
Nested tables messed up in FireFox (you heard me)	12	Jul 26, 2007
URGENT!!! IE6/XHTML nested table height scaling problem!!!	2	Jul 20, 2006
Scroll bar inconsistencies in Firefox vs. Chrome	2	May 14, 2010

Firefox image scaling in tables

Ryan

Jukka K. Korpela

Ryan

Ryan

Ben C

Jonathan N. Little

Ryan

Ask a Question

Similar Threads

Members online

Forum statistics

Latest Threads