iPhone, iFrames and meta viewports, oh my!

I've got a website that has the <iframe> HTML tag. I'm trying to make it display on an iPhone (using the default Safari web browser of course).

Initially I had my viewport set to something like this: <meta name="viewport" content="width=device-width" />, which seems to be the right thing to do.

However iPhone's don't work very well with iframes. They don't add scroll bars if the iframe content is too large. I have a problem now where the contents of the iframe are too wide for the screen (e.g. the 320ish px of the viewport). My iframe is now being cropped, and part of the content (includeing some important parts) are invisible. Since the user can't scroll left/right with this viewport (since the content is outside the viewport), some of my content is completly inaccessible.

I can get around this partially by setting a large width on my viewport, but that defeats the point.

This entry is tagged: