800x600, 1024x768...1400x1050 res.

Discussion in 'HTML' started by catalyst, Jan 30, 2008.

  1. catalyst

    catalyst Guest

    Hi! I'making a webpage in html+style in css. How to make that this webpage
    shows similar in all this 800x600, 1024x768...1400x1050 resoultions?
    It happens that 800x600 is much larger than of 1400x...
    it seems html table aren't stretching so good.As i'm a newbie in css too,
    how's stretching with css in this various resolutions? Is there any aid?

    Thanks.
    c.
    catalyst, Jan 30, 2008
    #1
    1. Advertising

  2. catalyst

    mrcakey Guest

    "catalyst" <> wrote in message
    news:fnqi66$jud$...
    > Hi! I'making a webpage in html+style in css. How to make that this webpage
    > shows similar in all this 800x600, 1024x768...1400x1050 resoultions?
    > It happens that 800x600 is much larger than of 1400x...
    > it seems html table aren't stretching so good.As i'm a newbie in css too,
    > how's stretching with css in this various resolutions? Is there any aid?
    >
    > Thanks.
    > c.


    I'll get slapped, but the simplest way is to creat a "container" div of
    fixed width (or preferably max-width but IE<7 doesn't understand that) and
    put your content inside that div.

    +mrcakey
    mrcakey, Jan 30, 2008
    #2
    1. Advertising

  3. catalyst

    Nico Schuyt Guest

    catalyst wrote:
    > Hi! I'making a webpage in html+style in css. How to make that this
    > webpage shows similar in all this 800x600, 1024x768...1400x1050
    > resoultions? It happens that 800x600 is much larger than of 1400x...
    > it seems html table aren't stretching so good.As i'm a newbie in css
    > too, how's stretching with css in this various resolutions? Is there
    > any aid?


    Not sure what you mean: do you want a table with the same width (in px)
    in any resolution or a table that 'stretches'?
    Compare <table style="width: 100%"> with <table style="width: 500px">

    --
    Nico
    Nico Schuyt, Jan 30, 2008
    #3
  4. catalyst wrote:
    > Hi! I'making a webpage in html+style in css. How to make that this webpage
    > shows similar in all this 800x600, 1024x768...1400x1050 resoultions?
    > It happens that 800x600 is much larger than of 1400x...
    > it seems html table aren't stretching so good.As i'm a newbie in css too,
    > how's stretching with css in this various resolutions? Is there any aid?


    Since you haven't shown us what you're doing or in what way it isn't
    behaving as you expect, an answer will be impossible unless a psychic
    comes along.

    Besides that, the screen resolution is absolutely irrelevant since (a)
    you don't know how large the browser window is and (b) as far as you
    know one user has 1400 x 1050 on a 13" (33cm) screen and is sitting half
    a meter away while another has 1024 x 768 on a two-meter projection
    screen and is sitting 5 meters away.
    Harlan Messinger, Jan 30, 2008
    #4
  5. catalyst wrote:

    > Hi! I'making a webpage in html+style in css. How to make that this webpage
    > shows similar in all this 800x600, 1024x768...1400x1050 resoultions?


    None of the above. All of the above.
    http://allmyfaqs.net/faq.pl?AnySizeDesign

    My monitor is 1680x1050, and I have two browser windows open
    side-by-each. Or one browser and some other application, maybe my web
    page editor. Screen resolution is unimportant. Think of mobile phones
    and PDAs, too. You site (if a general site) should work on all of them.

    > It happens that 800x600 is much larger than of 1400x...


    Hmmmm?

    > it seems html table aren't stretching so good.As i'm a newbie in css
    > too, how's stretching with css in this various resolutions? Is there
    > any aid?


    Are you planning to use tables for layout?
    http://allmyfaqs.net/faq.pl?Tableless_layouts

    http://htmldog.com/guides/cssbeginner/

    --
    -bts
    -Motorcycles defy gravity; cars just suck
    Beauregard T. Shagnasty, Jan 30, 2008
    #5
  6. catalyst

    mrcakey Guest

    "Beauregard T. Shagnasty" <> wrote in message
    news:l15oj.518957$...
    > catalyst wrote:
    >
    >> Hi! I'making a webpage in html+style in css. How to make that this
    >> webpage
    >> shows similar in all this 800x600, 1024x768...1400x1050 resoultions?

    >
    > None of the above. All of the above.
    > http://allmyfaqs.net/faq.pl?AnySizeDesign


    Is it me or are you advocating adding browser-sniffing JavaScript to support
    Netscape, a browser with approximately 0.5% of the market?

    >
    > My monitor is 1680x1050, and I have two browser windows open
    > side-by-each. Or one browser and some other application, maybe my web
    > page editor. Screen resolution is unimportant. Think of mobile phones
    > and PDAs, too. You site (if a general site) should work on all of them.


    No it shouldn't. It should work on the platforms he chooses to market to.

    +mrcakey
    mrcakey, Jan 30, 2008
    #6
  7. mrcakey wrote:

    > "Beauregard T. Shagnasty" wrote:
    >> catalyst wrote:
    >>> Hi! I'making a webpage in html+style in css. How to make that this
    >>> webpage shows similar in all this 800x600, 1024x768...1400x1050
    >>> resoultions?

    >>
    >> None of the above. All of the above.
    >> http://allmyfaqs.net/faq.pl?AnySizeDesign

    >
    > Is it me or are you advocating adding browser-sniffing JavaScript to
    > support Netscape, a browser with approximately 0.5% of the market?


    Why would you think that? I certainly don't care about Netscape (the
    old ones). I would never use browser sniffing. If you were referring to
    the part "Non-compliant browser detection" on that page, that was
    written when NS4 had more of an audience.

    >> My monitor is 1680x1050, and I have two browser windows open
    >> side-by-each. Or one browser and some other application, maybe my
    >> web page editor. Screen resolution is unimportant. Think of mobile
    >> phones and PDAs, too. Your site (if a general site) should work on
    >> all of them.

    >
    > No it shouldn't. It should work on the platforms he chooses to
    > market to.


    I see more and more people these days browsing the web from small screen
    devices. Don't they have money too?

    --
    -bts
    -Friends don't let friends drive Vista
    Beauregard T. Shagnasty, Jan 30, 2008
    #7
  8. mrcakey wrote:
    > "Beauregard T. Shagnasty" <> wrote in message
    > news:l15oj.518957$...
    >> catalyst wrote:
    >>
    >>> Hi! I'making a webpage in html+style in css. How to make that this
    >>> webpage
    >>> shows similar in all this 800x600, 1024x768...1400x1050 resoultions?

    >> None of the above. All of the above.
    >> http://allmyfaqs.net/faq.pl?AnySizeDesign

    >
    > Is it me or are you advocating adding browser-sniffing JavaScript to support
    > Netscape, a browser with approximately 0.5% of the market?
    >
    >> My monitor is 1680x1050, and I have two browser windows open
    >> side-by-each. Or one browser and some other application, maybe my web
    >> page editor. Screen resolution is unimportant. Think of mobile phones
    >> and PDAs, too. You site (if a general site) should work on all of them.

    >
    > No it shouldn't. It should work on the platforms he chooses to market to.


    You mean there are people who come to marketing meetings and say, "Our
    market shows us that our high-tech molded bicycle seats are popular in
    the 1400x1050 pixel, 15- to 17-inch screen, maximized browser community,
    but Brand X seats sell better in the 1024x768 pixel, 19-inch,
    browser-occupies-only-part-of-the-screen community"?
    Harlan Messinger, Jan 30, 2008
    #8
  9. Harlan Messinger wrote:
    > mrcakey wrote:
    >> "Beauregard T. Shagnasty" <> wrote in
    >> message
    >> news:l15oj.518957$...
    >>> catalyst wrote:
    >>>
    >>>> Hi! I'making a webpage in html+style in css. How to make that this
    >>>> webpage
    >>>> shows similar in all this 800x600, 1024x768...1400x1050 resoultions?
    >>> None of the above. All of the above.
    >>> http://allmyfaqs.net/faq.pl?AnySizeDesign

    >>
    >> Is it me or are you advocating adding browser-sniffing JavaScript to
    >> support Netscape, a browser with approximately 0.5% of the market?
    >>
    >>> My monitor is 1680x1050, and I have two browser windows open
    >>> side-by-each. Or one browser and some other application, maybe my web
    >>> page editor. Screen resolution is unimportant. Think of mobile phones
    >>> and PDAs, too. You site (if a general site) should work on all of them.

    >>
    >> No it shouldn't. It should work on the platforms he chooses to market
    >> to.

    >
    > You mean there are people who come to marketing meetings and say, "Our
    > market shows us that our high-tech molded bicycle seats are popular in
    > the 1400x1050 pixel, 15- to 17-inch screen, maximized browser community,
    > but Brand X seats sell better in the 1024x768 pixel, 19-inch,
    > browser-occupies-only-part-of-the-screen community"?


    Besides that, I'm curious why people who are so sure that it isn't worth
    building a more flexible design now don't see why it's even less worth
    building a design that will require a complete overhaul when the
    resolutions are even higher a few years from now. I'm thinking about the
    people who built fixed designs that worked at 800 x 600 several years
    ago and now have a presentation that can't be read on screens with twice
    the pixels in each dimension (text too small or columns too narrow) and
    that create increasing frustration as more and more users try to access
    them (because they see no reason why they shouldn't be able to after
    having shelled out the money for the capability) on cell phones.
    Harlan Messinger, Jan 30, 2008
    #9
  10. catalyst

    Ben C Guest

    On 2008-01-30, Harlan Messinger <> wrote:
    > mrcakey wrote:

    [...]
    >> No it shouldn't. It should work on the platforms he chooses to market to.

    >
    > You mean there are people who come to marketing meetings and say, "Our
    > market shows us that our high-tech molded bicycle seats are popular in
    > the 1400x1050 pixel, 15- to 17-inch screen, maximized browser community,
    > but Brand X seats sell better in the 1024x768 pixel, 19-inch,
    > browser-occupies-only-part-of-the-screen community"?


    People say much stranger things than that in marketing meetings.
    Ben C, Jan 30, 2008
    #10
  11. catalyst

    dorayme Guest

    In article <>,
    Harlan Messinger <> wrote:

    > Besides that, I'm curious why people who are so sure that it isn't worth
    > building a more flexible design now don't see why it's even less worth
    > building a design that will require a complete overhaul when the
    > resolutions are even higher a few years from now. I'm thinking about the
    > people who built fixed designs that worked at 800 x 600 several years
    > ago and now have a presentation that can't be read on screens with twice
    > the pixels in each dimension (text too small


    I wish some operating system makers thought more flexibly on this
    one too. When I moved from CRT to LCD and got higher res, great
    for pics, the menu fonts got peskily smaller.

    --
    dorayme
    dorayme, Jan 30, 2008
    #11
  12. Harlan Messinger wrote:
    > Harlan Messinger wrote:
    >> mrcakey wrote:
    >>> "Beauregard T. Shagnasty" <> wrote in
    >>> message
    >>> news:l15oj.518957$...
    >>>> catalyst wrote:
    >>>>
    >>>>> Hi! I'making a webpage in html+style in css. How to make that this
    >>>>> webpage
    >>>>> shows similar in all this 800x600, 1024x768...1400x1050 resoultions?
    >>>> None of the above. All of the above.
    >>>> http://allmyfaqs.net/faq.pl?AnySizeDesign
    >>>
    >>> Is it me or are you advocating adding browser-sniffing JavaScript to
    >>> support Netscape, a browser with approximately 0.5% of the market?
    >>>
    >>>> My monitor is 1680x1050, and I have two browser windows open
    >>>> side-by-each. Or one browser and some other application, maybe my web
    >>>> page editor. Screen resolution is unimportant. Think of mobile phones
    >>>> and PDAs, too. You site (if a general site) should work on all of them.
    >>>
    >>> No it shouldn't. It should work on the platforms he chooses to
    >>> market to.

    >>
    >> You mean there are people who come to marketing meetings and say, "Our
    >> market shows us that our high-tech molded bicycle seats are popular in
    >> the 1400x1050 pixel, 15- to 17-inch screen, maximized browser
    >> community, but Brand X seats sell better in the 1024x768 pixel,
    >> 19-inch, browser-occupies-only-part-of-the-screen community"?

    >
    > Besides that, I'm curious why people who are so sure that it isn't worth
    > building a more flexible design now don't see why it's even less worth
    > building a design that will require a complete overhaul when the
    > resolutions are even higher a few years from now. I'm thinking about the
    > people who built fixed designs that worked at 800 x 600 several years
    > ago and now have a presentation that can't be read on screens with twice
    > the pixels in each dimension (text too small or columns too narrow) and
    > that create increasing frustration as more and more users try to access
    > them (because they see no reason why they shouldn't be able to after
    > having shelled out the money for the capability) on cell phones.


    I'm wondering if this is the story behind the web page

    http://www.jwam.com.au/

    being discussed in the thread "Small font on web pages".
    Harlan Messinger, Jan 30, 2008
    #12
  13. catalyst

    rf Guest

    "dorayme" <> wrote in message
    news:...
    > In article <>,
    > Harlan Messinger <> wrote:
    >
    >> Besides that, I'm curious why people who are so sure that it isn't worth
    >> building a more flexible design now don't see why it's even less worth
    >> building a design that will require a complete overhaul when the
    >> resolutions are even higher a few years from now. I'm thinking about the
    >> people who built fixed designs that worked at 800 x 600 several years
    >> ago and now have a presentation that can't be read on screens with twice
    >> the pixels in each dimension (text too small

    >
    > I wish some operating system makers thought more flexibly on this
    > one too.


    They did.

    Windows, at least, allows one to specify the size of menus and other such
    things.

    --
    Richard.
    rf, Jan 30, 2008
    #13
  14. catalyst

    dorayme Guest

    In article <0U6oj.9160$>,
    "rf" <> wrote:

    > "dorayme" <> wrote in message
    > news:...
    > > In article <>,
    > > Harlan Messinger <> wrote:
    > >
    > >> Besides that, I'm curious why people who are so sure that it isn't worth
    > >> building a more flexible design now don't see why it's even less worth
    > >> building a design that will require a complete overhaul when the
    > >> resolutions are even higher a few years from now. I'm thinking about the
    > >> people who built fixed designs that worked at 800 x 600 several years
    > >> ago and now have a presentation that can't be read on screens with twice
    > >> the pixels in each dimension (text too small

    > >
    > > I wish some operating system makers thought more flexibly on this
    > > one too.

    >
    > They did.
    >
    > Windows, at least, allows one to specify the size of menus and other such
    > things.


    Refreshing to hear good things about Windows.

    I was not happy with the lack of the flexibility, up to Tiger at
    least, on Macs. One gets used to it and it still looks nice.
    There are all sorts of mouth watering flexibilities in Mac for
    Finder views so it might seem ungrateful of me to complain.

    In the case of Mac, there are a world of things in what is known
    as Resource forks, resources like notices and system icons and
    other stuff and these perhaps have been carried over from earlier
    OSs. It is perhaps a big deal to alter all this stuff or provide
    for variability in it to suit different users.

    --
    dorayme
    dorayme, Jan 30, 2008
    #14
  15. On 2008-01-30, dorayme wrote:
    > In article <>,
    > Harlan Messinger <> wrote:
    >
    >> Besides that, I'm curious why people who are so sure that it isn't worth
    >> building a more flexible design now don't see why it's even less worth
    >> building a design that will require a complete overhaul when the
    >> resolutions are even higher a few years from now. I'm thinking about the
    >> people who built fixed designs that worked at 800 x 600 several years
    >> ago and now have a presentation that can't be read on screens with twice
    >> the pixels in each dimension (text too small

    >
    > I wish some operating system makers thought more flexibly on this
    > one too. When I moved from CRT to LCD and got higher res, great
    > for pics, the menu fonts got peskily smaller.


    I have never seen one that didn't have that flexibility.


    --
    Chris F.A. Johnson, webmaster <http://Woodbine-Gerrard.com>
    ===================================================================
    Author:
    Shell Scripting Recipes: A Problem-Solution Approach (2005, Apress)
    Chris F.A. Johnson, Jan 30, 2008
    #15
  16. catalyst

    dorayme Guest

    In article <>,
    "Chris F.A. Johnson" <> wrote:

    > On 2008-01-30, dorayme wrote:
    > > In article <>,
    > > Harlan Messinger <> wrote:
    > >
    > >> Besides that, I'm curious why people who are so sure that it isn't worth
    > >> building a more flexible design now don't see why it's even less worth
    > >> building a design that will require a complete overhaul when the
    > >> resolutions are even higher a few years from now. I'm thinking about the
    > >> people who built fixed designs that worked at 800 x 600 several years
    > >> ago and now have a presentation that can't be read on screens with twice
    > >> the pixels in each dimension (text too small

    > >
    > > I wish some operating system makers thought more flexibly on this
    > > one too. When I moved from CRT to LCD and got higher res, great
    > > for pics, the menu fonts got peskily smaller.

    >
    > I have never seen one that didn't have that flexibility.


    Which flexibility? The one that my ungrateful self (considering
    the impressive flexibility that there already is) wants more of?
    <g>

    Have you experience with Macs (I may be missing some preference
    setting)? How do you hold the resolution at native for a LCD
    screen or any resolution for that matter while yet allowing one
    to set the size of the menu fonts that run across the top of the
    Finder (to take an example of a Mac environment). Never mind
    other things I have in mind for the moment?

    --
    dorayme
    dorayme, Jan 30, 2008
    #16
  17. catalyst

    Andy Dingley Guest

    On Wed, 30 Jan 2008 20:12:08 +0100, "catalyst" <> wrote:

    >How to make that this webpage
    >shows similar in all this 800x600, 1024x768...1400x1050 resoultions?


    Good web pages do indeed look similar at all resolutions, but it's
    important to have the right meaning of "similar". It's about the number
    of characters a particular user wants to see, not about counting pixels.

    Imagine a user, with a monitor. Their eyes can see text of a certain
    size, the image remains the same size, and the web designer wants to
    present text to them ideally in lines of 15 words (usability studies
    show that this is about the best for readng long blocks of text). Now
    imagine that tehy have a number of computers, of different display
    resolutions, all connected to this monitor through a switch.

    When they switch displays. the number of pixels varies. The size of
    letters, and ideally the number of letters across the browser window
    width too, should _not_ vary. This gives the user the best possible
    experience of consistent browsing.

    Now imagine another user, logging into these same computers. They have
    poor eyesight, so they adjust teh default text size in their browser(s)
    to be bigger. This users should now see bigger physical letters which
    they're able to read in comfort. Again it should remain consistent as
    they swap display resolutions.

    Another user also has a multi-display monitor switch, but their is
    bigger and they like to work with many windows open at once. We don't
    know what size text they prefer, but we do know that the ideal number of
    words on a line is about the same. As they re-size their browser
    windows (having also adjusted ther favourite text size) the web page
    should ideally keep the line length roughly the same in terms of
    character sizes, not in terms of pixel counting.

    How do we do this? Well the surprise is that it's all very easy - just
    set your widths in the "em" unit, not in pixels. CSS does the rest for
    you. It's also a good practice to _avoid_ setting widths whenever you
    can. Setting margins and letting the browser control overall size
    generally works out far better than trying to set the absolute width of
    some element in the middle.

    This is particularly important when working with heights. Avoid setting
    heights: set margins or padding, then let the browser fill the space and
    stretch the canvas as far as it needs to.

    Font sizes are best left unset, allowing the defaults to take effect. If
    you do set them, body text goes at 1em / 100% with no exceptions! Do NOT
    set them in pixels, points or mm.

    If you _wish_ to, set the maximum width of your overall "content" (the
    text block where the main part of the site content sits). Do this only
    once, do it in ems, and allow for some padding inside this. This keeps
    line widths constrained to the usability limit and avoids awkwardly
    long lines.

    Don't set the widths of nested elements. Set one, maybe set margins, let
    the others work it out from their parents or children.

    Where there are siblings (i.e. columns), set the width of _some_ of
    these columns, but not all. Maybe set left and right columns (menus,
    teasers and banner ads) to 20em each and let the centre fill out as it
    can best do. Maybe also contrain the centre with max-width, as
    described, but otherwise let it float to fill in the gap.

    When an element contains images, these are inherently pixel-sized, not
    character-sized. So here you might well set a rigid width, and do it in
    pixels. This can get awkward if there are sibling columsn sized in ems,
    and the users vary their window width a lot. Consider avoiding the
    problem altogether by using a wider column altogether, sized in ems, and
    floating the images inside this, allowing text to flow past them. it
    can look a lot more fluid this way when re-sizing.

    Whenever you design _anything_. use a crude HTML / CSS prototype to
    display the overall sizing you've created. Watch its behaviour as you
    re-size windows and adjust font sizes. You don't have to be perfect
    allthe time, you don't even have to be perfect at one particular size,
    you certainly can't avoid the layout breaking totally at some widths -
    but you should watch and see how extreme these limiting widths are, and
    make sure they're out of the likely range to encounter.


    --
    Cats have nine lives, which is why they rarely post to Usenet.
    Andy Dingley, Jan 31, 2008
    #17
  18. catalyst

    Andy Dingley Guest

    On Thu, 31 Jan 2008 09:54:16 +1100, dorayme
    <> wrote:

    >> Windows, at least, allows one to specify the size of menus and other such
    >> things.

    >
    >Refreshing to hear good things about Windows.


    Don't worry. If you do use this feature in Windows, it screws up default
    font sizes in IE

    You can always rely on a Gates product to screw you up one way or
    another. :cool:
    Andy Dingley, Jan 31, 2008
    #18
  19. catalyst wrote:

    > Hi! I'making a webpage in html+style in css. How to make that this webpage
    > shows similar in all this 800x600, 1024x768...1400x1050 resoultions? It
    > happens that 800x600 is much larger than of 1400x... it seems html table
    > aren't stretching so good.As i'm a newbie in css too, how's stretching
    > with css in this various resolutions? Is there any aid?


    Something to think about: My screen size is 1920x1600. What size is the
    viewport in which my browser is rendering your page?


    --
    Blinky
    Killing all posts from Google Groups
    The Usenet Improvement Project: http://improve-usenet.org
    Blinky: http://blinkynet.net
    Blinky the Shark, Jan 31, 2008
    #19
  20. catalyst

    catalyst Guest

    wow, thanks!
    Perhaps, i should try to use only % when building a page, but don't have
    that much experience to know is it possible to build such a webpage, it
    would be 100% simple webpage, without some extravagance things. That's what
    I'm aiming at, but not excluding ems...just haven't had time to give a shot,
    surely i hope i will. For the time being i had worked with the combination
    of px, auto and letters in ems, which i had recommenadions for, although
    many says px's for letters.

    Thanks for the tips!
    catalyst, Feb 2, 2008
    #20
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Adrienne
    Replies:
    0
    Views:
    377
    Adrienne
    Aug 6, 2003
  2. viza
    Replies:
    0
    Views:
    368
  3. Chris Morris

    Re: design size.....800x600 1024x768 ?

    Chris Morris, Aug 6, 2003, in forum: HTML
    Replies:
    0
    Views:
    394
    Chris Morris
    Aug 6, 2003
  4. Sid Ismail
    Replies:
    0
    Views:
    361
    Sid Ismail
    Aug 6, 2003
  5. Leiradella, Andre V Matos Da Cunha

    RES: RES: RES: Bare-bones Ruby

    Leiradella, Andre V Matos Da Cunha, Dec 29, 2004, in forum: Ruby
    Replies:
    0
    Views:
    128
    Leiradella, Andre V Matos Da Cunha
    Dec 29, 2004
Loading...

Share This Page