Page 1 of 2 12 LastLast
Results 1 to 10 of 12

Thread: How make page that is auto sized for any Computer

  1. #1
    Join Date
    Mar 2005
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default How make page that is auto sized for any Computer

    I need to know how to make you web page fit anyones display. I create my web pages using my display setting. Everything looks fine when I view the web page. My display is 1600 x 1200. But if someone views my page with displays other then 1600 x 1200 the page is really huge or off centered and what not.

    Is there a way to auto size for what ever a persons display settings are?

    Thanks in Advance

  2. #2
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,070
    Thanks
    44
    Thanked 3,216 Times in 3,178 Posts
    Blog Entries
    12

    Default

    Alot depends on the content.

    Strategy One:

    Let the page's content flow into the space available to it. For container elements (table, div, p, frames, etc.) use percentage widths. For fonts, use relative sizes (large, medium, small, etc.) Sometimes, floating content, especially images, will help (style="float:left;" for example). Don't worry about things looking exactly the same at all resolutions.

    Strategy Two:

    Pick a resolution you think is the lowest target for your page. Confine and center everything to those dimensions. There will be alot of blank space left and right at higher resolutions but, if the page lends itself to this type of presentation it will look OK.

    Strategy Three:

    Wing it. Lay out the page at the prevailing resolution, currently 1024x768, in my opinion. View it in other resolutions, make adjustments so it at least looks OK at other resolutions without losing its essential appearance at the core resolution. You can combine absolute position with relative, fixed widths with percentage ones to achieve this effect on a case by case basis.

    Others will have different opinions and there are probably other approaches I am not covering. The unifying principal in all three of these approaches is:

    Don't insist on the page looking exactly the same at all resolutions.

  3. #3
    Join Date
    Mar 2005
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Ok thanks I will convert my swf to fit 1024 x 768

    Is there a way to specify the web page size? I have looked in the properties of the pages but I don't see any thing that has to do with size or resolutions.

  4. #4
    Join Date
    Dec 2004
    Location
    UK
    Posts
    2,358
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by Papa
    I need to know how to make you web page fit anyones display.
    By producing a flexible layout. That tends to mean no (or carefully managed) absolute positioning, designing for sensible wrapping, and forgetting about making pixel perfect renderings across different user agents - to name a few.

    I create my web pages using my display setting. [...] My display is 1600 x 1200.
    Your display size means nothing. Few people will use their browsers at full size with large monitors - it makes text too difficult to read as scan lengths become far too long. More importantly, most users probably won't be able to get anywhere near that resolution - I certainly can't.

    Is there a way to auto size for what ever a persons display settings are?
    Yes, see above.

    Before I continue, I'd like to point out that I have a severe dislike of Flash-based sites. They tend to be badly written and a right pain in the ass to use. I'm not likely to be objective...

    Ok thanks I will convert my swf to fit 1024 x 768
    You have a Flash animation that large!? Oh dear... Unless you are intentionally targeting a very specific audience, you don't understand the Web as a medium.

    Is there a way to specify the web page size?
    No, you can't. What would be the point anyway if that size is ridiculously large? You should understand that the Web isn't under your control and you have to deal sensibly with that. Designing a site for any particular resolution is a bad idea as that resolution will only be useful for a small proportion of your potential visitors. As I hinted at above, monitor dimensions and viewport space are, for all intents and purposes, unrelated.

    Mike

  5. #5
    Join Date
    Mar 2005
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    http://www.freewebs.com/crak/NewSite.html

    Please comment on size and how to make it better. Understand it is still under construction

  6. #6
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,070
    Thanks
    44
    Thanked 3,216 Times in 3,178 Posts
    Blog Entries
    12

    Default

    Looks Good! Only thing I would do, and I don't know enough about flash to say how or even know if it is possible, is center the content on the page, it is fine as it is, center would just be better.

  7. #7
    Join Date
    Mar 2005
    Posts
    5
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    What resolution are you using?

  8. #8
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,070
    Thanks
    44
    Thanked 3,216 Times in 3,178 Posts
    Blog Entries
    12

    Default

    Generally 1024x768 but, I took a look at 800x600 and 1280x1024. All seemed fine. 800x600 was a 'perfect fit'. At the others, the content was all on the left, would be just a little nicer if it were centered at those resolutions but, only if it would also still be centered in a reduced viewport. Like you could change this:
    Code:
    <DIV style="position:absolute; align="center; top:40px; z-index:0">
    to:
    Code:
    <DIV style="position:relative; align="center; top:40px; z-index:0">
    unless that messes other things up.
    Last edited by jscheuer1; 04-01-2005 at 01:34 PM.

  9. #9
    Join Date
    Dec 2004
    Location
    UK
    Posts
    2,358
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by jscheuer1
    Like you could change this:
    Code:
    <DIV style="position:absolute; align="center; top:40px; z-index:0">
    to:
    Code:
    <DIV style="position:relative; align="center; top:40px; z-index:0">
    unless that messes other things up.
    You could have at least pointed out the syntax error. Persumably, that is all supposed to be one attribute value, in which case it should read:

    HTML Code:
    <div style="position: relative; text-align: center; top: 40px; z-index: 0;">
    Notice the change in the quotes and align to text-align (the former doesn't exist in CSS).

    Mike

  10. #10
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    29,070
    Thanks
    44
    Thanked 3,216 Times in 3,178 Posts
    Blog Entries
    12

    Default

    Oh, I missed that, darn this paid gig is messing up my recreational concentration. Or, since I still shamelessly mix the not too too old and the new:
    Code:
    <DIV align="center" style="position:relative;top:40px; z-index:0">
    might work better, having tested none. That text-align property might not center a flash presentation but, then maybe the align="center" won't either, it is a sure bet that the original code from the page won't do much of anything.

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •