Results 1 to 8 of 8

Thread: How to control the stretchness of the page

  1. #1
    Join Date
    May 2009
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default How to control the stretchness of the page

    Would request if you could assist how can I control the stretchness of a page. For example the width of the container is at 100%. The site will look like fully stretched across the monitor be it 17 inches or more.

    How can I control the width of the web page so that the site does not look fully stretched but remained at the centre of the monitor screen.

    Thank you,

  2. #2
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    100% is the full browser window, down it to 90% and give it a margin:auto;. This should give it a %5 border on the left and right. If you want better assistance please post a link or code.
    Corrections to my coding/thoughts welcome.

  3. #3
    Join Date
    May 2009
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Thanks for the quick reply

    Thank you for the prompt answer.

    Here is the URL of the site I am asking for :
    http://www.bookmyhotel.biz . On larger monitors i.e. 22 inch, the site is stretched out on the whole screen. It looks bad. If the container is centered and didn't stretched it would look great.

    Thanks

  4. #4
    Join Date
    May 2007
    Location
    Boston,ma
    Posts
    2,127
    Thanks
    173
    Thanked 207 Times in 205 Posts

    Default

    Can you screen shot what is happening I dont have a 22 inch monitor. I think your referring to the right column separating from the left though?
    Corrections to my coding/thoughts welcome.

  5. #5
    Join Date
    Aug 2005
    Location
    Other Side of My Monitor
    Posts
    3,494
    Thanks
    5
    Thanked 105 Times in 104 Posts
    Blog Entries
    1

    Default

    In your CSS find this:

    Code:
    #container {
    	width: 100%;
    	margin: 0;
    	background-color: #fff;
    	position: relative;
    }
    Change it to this:

    Code:
    #container {
    	width: 96%;
    	margin-left: auto;
            margin-right: auto;
    	background-color: #fff;
    	position: relative;
    }
    {CWoT - Riddle } {Freelance Copywriter} {Learn to Write}
    Follow Me on Twitter: @InkingHubris
    PHP Code:
    $result mysql_query("SELECT finger FROM hand WHERE id=3");
    echo 
    $result

  6. #6
    Join Date
    May 2009
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Thumbs up Thanks.

    Thank You! BLiZZaRD

  7. #7
    Join Date
    May 2009
    Posts
    8
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default On a 19 inches monitor white space is showing up

    Hi,

    I have seen if you see the site on a 19 inches or 22 inches monitor the middle content is stretched showing white space in between the two columns.

    Any suggestions pl.

    Thank you.
    Last edited by vinay111; 05-05-2010 at 03:00 PM. Reason: spelling mistake of columns

  8. #8
    Join Date
    Aug 2005
    Location
    Other Side of My Monitor
    Posts
    3,494
    Thanks
    5
    Thanked 105 Times in 104 Posts
    Blog Entries
    1

    Default

    You will have to do the same thing for each section as I listed above, giving a slightly less than 100% width and setting left and right margins to auto.
    {CWoT - Riddle } {Freelance Copywriter} {Learn to Write}
    Follow Me on Twitter: @InkingHubris
    PHP Code:
    $result mysql_query("SELECT finger FROM hand WHERE id=3");
    echo 
    $result

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
  •