Results 1 to 2 of 2

Thread: resoultion basic question

  1. #1
    Join Date
    Nov 2006

    Talking resoultion basic question

    Hi everyone,

    I'm new here, and would like to know how to center my webpage so that it will be viewable on every resoultion starting 800 and upto 1024 (the webpage is designed as 800, while any resoultion higher than that will have blank spaces on the side)

    I'm working with Visual Studio 2005.

    hope you could help me on this...

  2. #2
    Join Date
    Feb 2006
    Salisbury UK
    Centering without a limit is simpler than centering with a maximum.

    Centering without a limit uses one of two methods:-
    items 2 and 3.
    Item 2 is the best (your containing div must have a width, which you say it has, but must not be position: absolute, then just add margin: auto; ).
    Item 3 works if your div is position: absolute; but has a disadvantage if the viewer uses a window less wide than your div.

    Centering with a max (and a min) can be achieved using the Jellomold hack which was designed for IE6 but works in IE7 and Firefox too.

    IE7 and Firefox can use just max-width: 1024px; but then you won't get it to work in IE6 so it may be worth using the hack for all browsers. See item 1.
    The Jellomold max/min method needs all your divs to be flexible (ie have no stated width). If your webpage is set up with a fixed width, as it seems to be, you can only use one of the first two methods. Your page will always show 800px wide and the space either side will vary.

    Note that it is often better to make a page 780px wide so that there is room for a vertical scrollbar for viewers using a window 800*600. This should mean that there will not be a horizontal scrollbar.
    Last edited by Wickham; 14 Nov 2006 at 06:20 AM.
    Code downloaded to my PC will be deleted in due course.
    WIN7; IE9, Firefox, Opera, Chrome and Safari for Windows; screen resolution usually 1366*768.
    Also IE6 on W98 with 800*600 and IE8 on Vista 1440*900.

Posting Permissions

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