Coding Landscape mode: Is there an inspector for iOS simulator?

Question

I'm coding a fully responsive cross-browser site. I've already coded portrait mode and what I did to inspect changes and modify the my CSS file was to scale my Chrome Browser up to a point where I saw the same thing on my browser and on my iOS simulator. In that way I could work out every change and edit my CSS file. I now need to do the same on landscape mode, but I can't find a way to use an inspector that would simulate landscape mode.

I have Chrome, Firefox, Safari and IE and I'm open to any tool that would enable me to inspect the webpage simulating landscape mode not only regular tablets and phones but also Retina-supported devices.

Answer 1

Here is a really cool plugin. http://lab.maltewassermann.com/viewport-resizer/

You can use it on any browser. Drag the "Click or Bookmark" button to your bookmark bar, then click it on any page you want to change the view size for.

Here is the image of the button you want to drag to your bookmark bar:

Here is an image of the toolbar that it adds.

My favorite tool to use for this is http://www.browserstack.com/. This isn't free but well worth it.

A third option is Adobe Edge Inspect. You can display the page right on the device but inspect the elements through you laptop or desktop computer. This option is free but you need to create an Adobe ID.