3

i have this weird problem. I have just set up a page, built with bootstrap 3.0.3, on my own web server.

My problem is the responsive part, it works fine in chrome and firefox and even on my mobile when i put up a public link via dropbox. But when i try to access it from my web server using my mobile, samsung galaxy s3, it stops to work. I get the whole page instead of being shrunk to the mobile version.

I have included the view port:

<meta name="viewport" content="width=device-width, initial-scale=1">

When running a test on googles page speed page i get an error stating the viewport doesn't exist.

My webserver is running on a raspberry pi with nginx.

Josh Crozier
  • 233,099
  • 56
  • 391
  • 304
j0llan
  • 31
  • 1
  • 3
  • What mobile phone are you using to test with? – Malcolm Box Dec 12 '13 at 19:44
  • Galaxy S3 but i don't think it's the phone that is the problem. When i access the page from my public dropbox link everythink resizes as it should. – j0llan Dec 12 '13 at 20:28
  • I have this same problem. Collapsing the screen to 720px in chrome produces the exact result required, with the collapsed navbar and everything, but accessing it over wifi or on the hosted server produces the tablet breakpoint. I am stumped. – rurabe Feb 07 '14 at 06:46

4 Answers4

5

Finally! from Responsive website zoomed out to full width on mobile:

<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
Community
  • 1
  • 1
rurabe
  • 447
  • 4
  • 13
1

Are you using URL Frame (Masked Forwarding) for redirect your domain to your web server?. I had the same problem as you: (no responsive for devices as mobile when accessing to my website via remote server.

Notice URL Frame, may include a <frame> or <iframe>, in that case the responsive part for devices such mobile,tablets,etc... won't work.

bheatcoker
  • 539
  • 5
  • 10
0

Are you using local copy of bootstrap files, or remote?

Try to include files with this:

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap-theme.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>

If it worked and you tried to use local files before then this could be problem with link to your local files. Try inpect them with debug console in browser if one of them is 404'ed. If so... you must repair links.

stuszynski
  • 21
  • 2
  • Hi, i'm using local copy but i have tried remote aswell with no luck im afraid. It's not the end of world but just annoying that i can't get it to work. – j0llan Feb 21 '14 at 13:55
0

Make sure you have 

<!DOCTYPE html>

being sent as the very line in your code

Hemant
  • 1,999
  • 2
  • 12
  • 8