I have used twitter bootstrap in my project with DotNetNuke. I did my designing and layout using HTML, CSS, bootstrap. The responsive design was working fine when I tested it on different mobile devices and even if when I resize my browser window.
As it was working well, I converted the design to DotNetNuke Skin. Now, the responsive design works fine only when I resize the browser window and not on mobile devices. I understand the flow in which DNN loads stylesheets and I have followed it. I have made my skin.css as a combination of bootstrap.css and followed by the content of bootstrap-responsive.css
I am not able to find the problem as if I use the same skin.css with my html, it works fine but it doesn't work with DNN (on mobile devices).
You're missing the meta that targets mobile devices for proper scale. Insert the following in the header of your page:
<meta name="viewport" content="width=device-width, initial-scale=1.0">
I just notice something interesting and want to share it, maybe it will help someone. In the site header section you should include first the bootstrap.css and only after that the bootstrap-responsive.css because obviously the responsive.css depends on the the bootstrap.css
Of course the meta tag should be also present.
<link href="/css/bootstrap.css" rel="stylesheet" type="text/css" />
<link href="/css/bootstrap-responsive.css" rel="stylesheet" type="text/css" />
<meta name="viewport" content="width=device-width, initial-scale=1.0">
Make sure responsive CSS(responsive.css) is included after basic not before.
来源：https://stackoverflow.com/questions/10700276/not-able-to-make-bootstrap-responsive-design-work-with-dotnetnuke