Click to See Complete Forum and Search --> : Novise!! Adjusting table with images to screen


kinghimself
11-03-2005, 05:28 PM
I have a simple table with two table rows, one for images and one for comments, 4 cells wide. At first I set the width of the images to 300 pixels, as this is roughly a fourth of my screen width. Now my page looks nice on my screen as it's adapted to my resoulution, but not that nice on screens with lower res.
So I tried to set the width of the cells to 25% instead, but I can't make it work! if I set the width of the image to 25%, it fills out 25% of its cell, not of the screen. If i set the width of the cells to 25%, nothing happens, as the image width seems to have priority.

How can I make my 4 cell wide table to fill out 100% of the screen in any resoulution?

JPnyc
11-03-2005, 06:07 PM
Set the table width to 100%, not the cells.

kinghimself
11-04-2005, 06:23 AM
I've allready tried that, but as I was saying, any width set to the table or its cells seems to be overridden by the width og the images. It seems to me like the width of images has priority over the width of tables.

kelly23
11-04-2005, 10:25 AM
Hi,

You can make your 4 cell wide table fill the resolution by using a table width of 100%, but the images will be a fixed size, preferably no more than would fit in a screen at 800 x 600 resolution (which would actually be a total of about 760px wide if you allow for the vertical scrollbar) so that the page doesn't have to scroll horizontally for viewers with 800 x 600 res.

The only other way would be to use javascript to detect the resolution, and then set the size of the images based on that.

The problem with trying to use percentages for the images themselves is that the image quality will not be good for people with higher resolutions than yours. You can get decent quality making an image a smaller percentage, but it degrades when you go over 100%.

kelly

Lerura
11-06-2005, 04:41 PM
try to use this opening tag for the table:<table width="100%" cols="4"> and skip all width settings in the cells

the cols-attribute makes all cells take up the same amount of the table's width,
unless some of the images is wider than, in this case, 25% of the screen width

the cols-value must always be the total number of columns in the table

kelly23
11-06-2005, 04:48 PM
It still won't work. The images will be whatever their width is no matter what the table size is, unless you specify an image's width as a percentage, but that is a percentage of the image's original width, not a percentage of the screen width or of the table width.