I have a web page that was designed by editing the page the "old way"
---no program. Now that the page is widely distributed I am getting
feedback that some monitors have different resolutions and I need to
change the size of the
page. How can I accomplish this now?
the page in question is here:
http://www.corvettehacks.com/ncrs2a.html
Time to learn some CSS, some more recent HTML coding style, and mostly
what a "fluid design" is all about. Search this ng and c.i.w.a.h for
the next clues and the books to read (Head First / Lie & Bos).
Here's a quick hack at it
<
http://codesmiths.com/dingbat/lj/usenet/corvette/>
This is just your page, with the addition of the well-known 3 column
CSS layout from
<
http://bluerobot.com/web/layouts/layout3.html>
This re-sizes pretty well, for a mixture of font sizes and window
widths. All I did here (5 minutes work, you have to pay for 6) was to
attach the Bluerobot CSS, wrap the big <table> in the "content"
column, change the advert tables to <div>s and twiddle a few bits of
CSS to change the look from Bluerobot's default.
Note the following:
* There's a bunch of invalid markup in here, mainly unclosed elements.
Learn what a HTML validator is.
* The CSS is an embedded stylesheet, for your reading pleasure. On a
live site it should be external.
* You can improve the markup a lot, especially the ads. I did the
first couple.
* The detail formatting is how Bluerobot left it. Rest is up to you.
* It doesn't re-size for every combination in the world. When it gets
tight, the ads run over the table. I did this because that's how
Bluerobot works to start with and it's near enough for jazz. It's
changeable, if you have strong feelings that it should work
differently. There's no perfect fix for everyone, it's a question of
picking your favourite compromise in the extremes. Play with it - play
with different window sizes, with different font sizes.
No doubt others will have comments.