Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

I'm sure this is common knowledge for web-developers but I couldn't turn up anything on google.

Some websites, like mine, look different on widescreen monitors than on regular monitors. How can I see what a webpage would look like in widescreen without actually having a widescreen monitor? (scrolls-bars?)

Is there a tool or feature I can enable?

share|improve this question
1  
Why can't you just resize your browser window to a widescreen aspect ratio? –  Lèse majesté Apr 27 '12 at 7:19
    
Windows Vista doesn't seem to allow stretching the window too big. –  Kevin Duke Apr 27 '12 at 7:21
    
I've never used Vista, but I've used both XP and Windows 7, and both let you resize windows to whatever height/width ratio you want. If you have 4:3 monitor, you can just decrease the height of your browser window to 9/16th of the width. If you have a widescreen monitor, you just decrease your width to 4/3rds of the height. –  Lèse majesté Apr 27 '12 at 7:24
1  
There's definitely a maximum Y stretch for windows on my computer. I know the method you are describing but the window simply will not stretch past a certain width, even if there is more room on the screen –  Kevin Duke Apr 27 '12 at 7:26
    
Max height/width is irrelevant. If you can't extend the height, just decrease the width. If you can't increase width, just decrease height. You can still achieve whatever aspect ratio you want, unless you're not after a specific aspect ratio and you're talking about how your site looks on higher resolution displays. –  Lèse majesté Apr 27 '12 at 7:28
show 2 more comments

6 Answers

I would recommend you to use a responsive theme for your site or make your site responsive. This way you can eliminate all the possibilities of resolution problems.

eg: Wikipedia uses responsive design

To try how this resposnive design in Wikipedia works just adjust your browser sizez and see how the site adapts to that browser size .

share|improve this answer
add comment

Decrease the height of your browser window until you've got the right aspect ratio and then set your browser zoom to something less than 100%. You'll have to do the maths to work out what this would represent for non-zoomed windows.

share|improve this answer
add comment

You can use tools such as http://quirktools.com/screenfly/ or http://resolutiontester.com/ to see your website in various resolutions

share|improve this answer
add comment

I wondered if you wanted a techique to make your site always display xyz pixels wide?

If so, I added this to my .css

..#Content { width:985px; margin:0px auto; text-align:left; } Then in my html used:

..body>

..div id="Content">

This is all crude, my point is that if you want this, it can be done, and other will show you how to do it much better.

share|improve this answer
add comment
up vote 1 down vote accepted

Firefox now has this feature built in. Under "Web Developer" click "Reponsive Design View"

share|improve this answer
add comment

You want to use relative scaling, using "percents" and not "pixels" since monitors come in all shapes and sizes.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.