Lauren F
Lauren F

Reputation: 1322

Bootstrap Mobile Not Working

I have worked with Bootstrap many times, and have only seen this issue when my meta viewport tag is missing. However, that is loaded, and I am still experiencing issues with Bootstrap on mobile devices. Might anyone know what else could be causing this?

Issues:

Head:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">

    <title>Training Portal</title>
    <!-- bootstrap/jquery -->
    <link href="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" rel="stylesheet">

    <!-- custom stylesheet -->
    <link href="<?= base_url("stylesheets/cust.css"); ?>" rel="stylesheet" type="text/css" media="screen">

  </head>

Scripts at end of <body>:

    <!-- scripts -->
    <script src="http://code.jquery.com/jquery.js"></script>
    <script src="<?= base_url("assets/script.js"); ?>"></script>

    <!-- Bootstrap JavaScript -->
    <script src="http://netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
  </body>

Viewport data also added to CSS:

@viewport{
    zoom: 1.0;
    width: extend-to-zoom;
}

Example of issue on mobile:

enter image description here

What this looks like on desktop:

enter image description here

Upvotes: 7

Views: 2143

Answers (2)

user2182349
user2182349

Reputation: 9782

I see "undefined index: session-course" in the messages returned from PHP, in templates/dashboard.php. While it is only a notice, it is probably corrupting the CSS so the browser can't render it.

Upvotes: 0

Te Riu Warren
Te Riu Warren

Reputation: 239

It appears to be a PHP error, and judging by the lack of CSS, I'm going to take a stab and say that maybe the PHP short tags (<?= and <?) are not enabled?

Upvotes: 1

Related Questions