How to design for multiple resoulutions!?!?!
Hey, How would I Be able to design my site to support multiple resoulutions? i want it to be full screen on 800X600 & 1024X768... anyone know if this is possible? or this site (icrontic.com) has some little Java didi at the front which does some resizing s***, but i dont know waht it actyualy does... Hrmmm im supposed to opent the site on the 8th... need this info asap
Moderator edit: Please refrain from swearing on The Webmaster Forums.
Brian Farkas posted this at 06:29 — 2nd June 2001.
They have: 1,015 posts
Joined: Apr 1999
Lonewolf, welcome to TWF!
You should be able to accomplish this by using percentages instead of fixed widths in your table cells. For example, instead of setting a width of a column as 300 pixels, you could simply make it 20% (or any other percentage).
If you just wanted one area to expand, you could make the other areas fixed widths, in pixels, and set the expandable area width to 100%. That is what I did with intersurge.com, and it seems to work fairly well.
Good luck, please let us know if you have any more questions.
Megan posted this at 14:33 — 2nd June 2001.
She has: 11,421 posts
Joined: Jun 1999
Yes, a basic layout could be coded like this:
<table width=100%>
<tr><td width=200> fixed width left side navbar
<img src="spacer.gif" width=200 height=1> Transparent gif
makes sure that the table cell doesn't resize weirdly in
Netscape)
</td>
<td> Flexible content area will expand to fill the rest of the screen
</td>
</tr>
</table>
Megan
Connect with us on Facebook!
Lonewolf posted this at 14:43 — 2nd June 2001.
They have: 2 posts
Joined: Jun 2001
Hrmmm i have a site like this though (sorrry for my ascii skillz
_________|_|____|_|
| | | |
| | | |
| | | |
| | | |
|_|____|_|
|_|____|_|
I have a top area for the sites logo & a banner add, a lefthand sidebar, righthand sidebar and a bottom bar... no way to do this with layers?? there alot easyer to work with
Megan posted this at 16:13 — 2nd June 2001.
She has: 11,421 posts
Joined: Jun 1999
This is what your code would look like then:
<table width=100%>
<tr><td width=150>absolute top right corner cell</td>
<td>flexible top middle cell</td>
<td width=150>absolute top left corner cell</td>
</tr>
<tr><td width=150>absolute right side</td>
<td> flexible middle cell</td>
<td width=150>absolute left side</td>
</tr>
<tr><td width=150>bottom right corner</td>
<td>flexible bottom middle</td>
<td width=150>bottom left corner</td>
</tr>
</table>
Of course, you would change the width=150 to whatever you need, and add the spacer.gif's in the fixed width cells for netscape.
I know that you can do flexible width sites with layers but I'm not sure how to do that exactly. I think it's usually easier and more reliable to use tables in this case.
Megan
Connect with us on Facebook!
Busy posted this at 22:04 — 2nd June 2001.
He has: 6,151 posts
Joined: May 2001
Tables are the sure fire way, The way Megan Jack and Brian Farkas tell it, works, and is the easiest way. One slight change to Megan Jacks method thou, if you have lots of links, graphics (icons, banners etc) or a generaly slow loading page, you should seperate the top table cell so it loads first and gives your viewers something to see.
absolute top right corner cell
flexible top middle cell
absolute top left corner cell
absolute right side
flexible middle cell
absolute left side
bottom right corner
flexible bottom middle
bottom left corner
layers can be used but isnt as full proof, plus layers can be turned off on the browser resulting in your page being one big mess. Layers also arent widely accepted - the good ole browser wars.
Tables is probably one of the scariest parts of learning HTML (if you learn it) but really is quite easy and once you know it you wonder how you ever made web pages without it.
Want to join the discussion? Create an account or log in if you already have one. Joining is fast, free and painless! We’ll even whisk you back here when you’ve finished.