Viewport not sizing correctly on Android

Question

I got a weird problem with the viewport. On iPhone & Android landscape it looks great, but in Android portrait mode it looks horrible.

Here is my meta tag:

<meta name="viewport" 
      content="user-scalable=no; width=device-width; target-densityDpi=device-dpi"/>

Images below:

Answer 1

Try using commas instead of semicolons as delimiters. Also, I wouldn't bother with target-densityDpi=device-dpi as it's only supported in older Android browser versions and does more harm than good.

So, that would give you:

<meta name="viewport" content="user-scalable=no, width=device-width "/>