I primarily use Google Chrome on Windows XP and for some reason I cannot get it to resize down to below 555px. I’m working on learning how to design responsive web design layouts but it’s hard to test the widths when I can’t make my browser go any less wide than 555px. I also have a similar problem in Firefox but at least that one I can get it to resize down to about 380px. But it won’t go below that. Does anyone else have this problem? Does anyone have a fix for this?
It’s just how each browser behaves, and you can’t do much about that. Opera lets you go as narrow as you like, so perhaps try that. Also, you can download Mobilizer to get a sense of how your design might look on the more popular mobile devices, and you can get a sense of what you site will look like in [URL=“http://www.opera.com/developer/tools/mini/”]Opera Mobile, which is one of the more popular mobile browsers.
Oh ok. Thanks for those 2 resources. Definitely gonna check those out.
Install the Web Developer Toolbar on Firefox. Under the “Resize” menu, you can set custom dimensions to whatever you like. I’ve just tried with a width of 200px - no problem. Under “Miscellaneous”, there is a “Small Screen Rendering” option, which does pretty much the same thing, although I’m not sure exactly what the dimensions are for that.
Oh nice. I installed that for Firefox. When I go to the “Resize” and then “Resize my window…” I get the dialogue box that lets me input dimensions. If I just put in say 200px by 380px without checking the box “Resize Viewport” it resizes fine. But when I check the box for “Resize Viewport” it goes to a bigger size, much wider than 200px. What’s the point of the Resize Viewport?
Blimey, I’ve been using that for years and never properly checked out all the things it can do. 
I had another Chrome extension before called Resolution Test I think but it didn’t seem to work and so I tried the one you mentioned also and it still won’t let my browser go below 555px. I selected 320 x 480 and it will only resize to a max size of 555 x 374 for the viewport size. So strange. I did get the Web Developer Toolbar to work in Firefox though. I just don’t quite understand why when I click the check box for viewport size it make the window bigger than what I selected.
@ralph.m … do you know how accurate the mobilizer app is? I just viewed a site I’ve been working on and it was very strange the whole middle content section didn’t show up at all. but I’ve viewed it on my mobile phone and I could see it just fine.
Unfortunately, no, but I’d love to know what others say. I’ve recently compared its results with an iPhone, and the comparison is close but not exact. The main difference is in sizing—where the real iPhone tends to fit a site in its viewport no matter how large, where Mobilizer doesn’t seem to scale it down by default, but just shows the top left corner if the site is fixed width.
Ultimately, there’s no fully reliable test except on the deice itself … which is a real pain for web designers, as there are hundreds of different phones out there.
Some OSed like iOS and Android have developer kits you can download and which have simulators. The iPhone simulator is pretty good, but I haven’t looked at the others.