stretched widescreen web design

Discussion in 'HTML & Website Design' started by nile1483, May 14, 2009.

  1. #1
    Hello friends,

    i hope you all are fine, i am facing one problem since many day, i design website with fixed width(1000px) but when i see this web in wide screen, its look stretched images, if any one have solution let me know.

    thanks
    dp and members
     
    nile1483, May 14, 2009 IP
  2. autouch

    autouch Peon

    Messages:
    17
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #2
    The widescreen you are viewing probably doesn't have the correct resolution. Widescreen nowadays simply mean 1280x800 or above. You probably have a resolution of 1020x720 set up on the widescreen which will cause everything to be stretched.
     
    autouch, May 15, 2009 IP
  3. lebensborn

    lebensborn Peon

    Messages:
    40
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #3
    I think it's to do wit more of the aspect ratio than anything...

    I'd say create a fixed width site, and put it inside a auto margin wrapper, will look something like this:

    CSS:

    body {
    	background-color: #ccc;
    }
    
    #main_wrapper{
    border:0;
    margin:0 auto;
    width:1000px;
    height:auto;
    }
    Code (markup):
    HTML:

    <html xmlns="http://www.w3.org/1999/xhtml" >
    
    <head profile="http://gmpg.org/xfn/11">
    
    <link rel="stylesheet" href="StyleSheet.css" type="text/css" media="screen" />
    
    <title></title>
    
    </head>
    
    <body>
    
    	<div id="main_wrapper">
    
            </div>
    
    </body>
    
    </html>
    Code (markup):
    The main wrapper will stay the same size no matter what the screen resolution is and will auto adjust to stay centered. Just put all your code inside the "main_wrapper" and it should be sorted (although you may have to adjust your code a little to get it to work )
     
    lebensborn, May 15, 2009 IP