Welcome to WebmasterWorld Guest from 54.163.25.166

Forum Moderators: brotherhood of lan & mack

Message Too Old, No Replies

Making your web pages fit in any screen resolutions

page layout

     
1:20 pm on Mar 13, 2004 (gmt 0)

New User

10+ Year Member

joined:Feb 19, 2004
posts:36
votes: 0


I would like to make changes to my site that will adjust the size/page layout to fit in any screen resolutions.

Please explain if you how to make the changes.

Thanks

2:44 pm on Mar 13, 2004 (gmt 0)

Senior Member from CA 

WebmasterWorld Senior Member encyclo is a WebmasterWorld Top Contributor of All Time 10+ Year Member

joined:Aug 31, 2003
posts:9063
votes: 2


Welcome to WebmasterWorld, cybertime!

The method depends on how your page is built. What you need to do is basically replace fixed width sizes defined in the tables or the CSS, and replace them with percentages. For example, if you have a table-based design with a fixed-width container you may have something like:

<table width="768">

You could replace it with:

<table width="95%">

You may want to keep one or two columns fixed-width, but the main content column fluid.

12:15 am on Mar 14, 2004 (gmt 0)

New User

10+ Year Member

joined:Feb 19, 2004
posts:36
votes: 0


Thanks for the message, Encyclo.

I used HTML-kit to designed the site.

I will take you advise and change the table width to %s.

Thanks again,
Cybertime

5:00 pm on Mar 14, 2004 (gmt 0)

Junior Member

10+ Year Member

joined:Dec 28, 2003
posts:58
votes: 0


Hey Cybertime,
Just now finished making my site fit all screen resolutions.....it turned out to be a little more difficult than I expected....Watch out for things like text boxes (moveable boxes included with popular web page making software like "Frontpage"). If your webpage isn't anchored down completely in a table, then whatever is loose will free float depending on screen resolutions. What looks good in one setting won't necessarily be readable in the next. Solved it by getting rid of all unanchored text and art, and placing the comment align="center" in my table tag. Hope this helps.
12:49 am on Mar 16, 2004 (gmt 0)

New User

10+ Year Member

joined:Feb 19, 2004
posts:36
votes: 0


Thanks BuckerBucker.

I will keep this in mind.

I am new at this, will you be ablet to explain what you meant by "webpage isn't anchored down completely in a table, then whatever is loose will free float depending on screen resolutions".

Thanks.

2:24 am on Mar 16, 2004 (gmt 0)

Full Member

10+ Year Member

joined:Jan 9, 2003
posts:330
votes: 0


You might want to have a look over at the CSS Forum [webmasterworld.com] or you can search for "liquid design", meaning design that will adjust to different screen resolutions.
4:15 am on Mar 16, 2004 (gmt 0)

Junior Member

10+ Year Member

joined:Dec 28, 2003
posts:58
votes: 0


Cybertime,

When I used "Frontpage" to make my pages, they offered things like "text boxes" that could be filled with text or images. These boxes, once placed on the page, could be freely moved to the locations you wanted on your page. Unfortunately, when the screen size or resolutions were changed, the boxes freefloated to whereever they wanted, ususally covering up the most important things on the page. I finally got rid of all the fancy stuff, and settled with good old fashioned tables with good old fashioned code. Additionally, I took the advice of Encyclo, threw the Front Page coding out the window, and did all my work in notepad first, which left out all the free floating code of Frontpage. If I've gone on too long.....sorry....I've struggled for two weeks with this problem, and I have finally WON!

8:36 pm on Mar 17, 2004 (gmt 0)

New User

10+ Year Member

joined:Feb 19, 2004
posts:36
votes: 0


Thanks Globay and BuckerBucker for your post.

I have visited the css posting and found it very useful

Cybertime.