Welcome to WebmasterWorld Guest from 54.227.5.198

Forum Moderators: brotherhood of lan & mack

Message Too Old, No Replies

Making your web pages fit in any screen resolutions

page layout

     

cybertime

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

10+ Year Member



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

encyclo

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

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



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.

cybertime

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

10+ Year Member



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

BuckerBucker

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

10+ Year Member



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.

cybertime

12:49 am on Mar 16, 2004 (gmt 0)

10+ Year Member



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.

globay

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

10+ Year Member



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.

BuckerBucker

4:15 am on Mar 16, 2004 (gmt 0)

10+ Year Member



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!

cybertime

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

10+ Year Member



Thanks Globay and BuckerBucker for your post.

I have visited the css posting and found it very useful

Cybertime.

 

Featured Threads

Hot Threads This Week

Hot Threads This Month