Simple HTML Q-Resizing for screen res

:confused;I am a cut & paste kinda guy, learning as I need, so I know a little
about a lot and not a lot about anything; but this screen size/resize thing is
very confusing to me. How does one make it so that the pages load to the full
screen and look correct on any res the viewer uses? I had always thought that
if I used an image, it would not resize when the user resizes, but have seen
some sites where the image does, in fact resize (ti a certain point...) I have
gotten the point, lately, of just using undersized layouts, but that is
certainly not the right way. I use a template for my headers, and the pages are
a mixture of images and text laid out in layout tables & cells.
I have been motoring along expecting it to suddenly come to me, but actually
understand this topic less today that before. Any input sincerely appreciated.

Dave Harding

If you've seen images resize according to the browser window, that's big
news; never seen that before.
Although the FireFox browser for example does resize images (when not
part of a page layout) to fit in the window. But that's a browser
feature, not a page design.
The only case in which images actually adapt to the window size is in
the case of some Flash sites, if the Flash files have been published for
such purpose.

Now about flexible layout:
If you want your html page layout to adapt to the size of the browser
window, you need to use relative sizes, i.e. percents instead of pixels.
For example this table:
<table width="90%" bgcolor="#000000"><tr><td></table>
will adapt it's width to 90% of the browser window width.
If you place all your page content inside that table and leave all
dimensions in percents, then your page layout will adapt top the browser
window size.
If, however you place an image in that table and your image is 800
pixels wide, then your table will always be at least 800 pixels wide,
because images DO NOT resize.

You can use percents for all your tables and cells (width only,
specifying the height is not proper html and it is almost never necessary).
You can also use percents with CSS layout.

If flexible layout is too complicated for you or if that's not what you
want, the only way to be sure that a page will fit in all screens is to
keep its width below 600 pixels, around 580 or so, because some (few)
people still use a 600 pix wide screen.

digitaldeb wrote:

:confused;I am a cut & paste kinda guy, learning as I need, so I know a little
about a lot and not a lot about anything; but this screen size/resize thing is
very confusing to me. How does one make it so that the pages load to the full
screen and look correct on any res the viewer uses? I had always thought that
if I used an image, it would not resize when the user resizes, but have seen
some sites where the image does, in fact resize (ti a certain point...) I have
gotten the point, lately, of just using undersized layouts, but that is
certainly not the right way. I use a template for my headers, and the pages are
a mixture of images and text laid out in layout tables & cells.
I have been motoring along expecting it to suddenly come to me, but actually
understand this topic less today that before. Any input sincerely appreciated.

Dave Harding

On Sat, 13 Nov 2004 20:17:31 +0000 (UTC), in macromedia.dreamweaver
"digitaldeb" <webforumsuser (AT) macromedia (DOT) com> wrote:

| :confused;I am a cut & paste kinda guy, learning as I need, so I know a little
| about a lot and not a lot about anything; but this screen size/resize thing is
| very confusing to me. How does one make it so that the pages load to the full
| screen and look correct on any res the viewer uses? I had always thought that
| if I used an image, it would not resize when the user resizes, but have seen
| some sites where the image does, in fact resize (ti a certain point...) I have
| gotten the point, lately, of just using undersized layouts, but that is
| certainly not the right way. I use a template for my headers, and the pages are
| a mixture of images and text laid out in layout tables & cells.
| I have been motoring along expecting it to suddenly come to me, but actually
| understand this topic less today that before. Any input sincerely appreciated.

The 'trick' is to use percentages for your tables. The table, and
therefore the tables' contents, will adjust to the viewers screen
size.

You can also do the same for your images.

<TABLE WIDTH="10%" HEIGHT="10%">
<TR>
<TD>
<IMG SRC="images/pic1.gif" WIDTH="100%" HEIGHT="100%">
</TD>
<TD>
<IMG SRC="images/pic2.gif" WIDTH="100%" HEIGHT="100%">
</TD>
</TR>
</TABLE>

This will confine the image to 100% of the cell it occupies.

If you want something a bit more 'dramatic' try :
<IMG SRC="images/pic2.gif" WIDTH="100%" HEIGHT="100%">
on the page outside of the table.
---------------------------------------------------------------
jnorth (AT) yourpantsbigpond (DOT) net.au : Remove your pants to reply
---------------------------------------------------------------

As far as an image that resizes, yes, images resize in IE6, at least. If you
simple link to an image, then it resizes with the window. Why is this behavior
not able to be used in regular html?

Regarding the other re-sizing, now I do recall. It is a balancing act to get
things they way I want, and the font thing had me making my text as images
(which do not resize) and my jpg's. So, I need to get rid of the images/text
and live with the fonts that are provided. I would also appear that css is my
next "field of study". Looked at css before, but am scriptually challenged...

Thanks for the info