I am creating a site using Bootstrap, everything is working fine however when I go to view the site on my iPhone the navbar doesn't collapse. When viewing on my windows phone it works perfectly.
Here is the code for my header, can anyone see why this is happening?
<!DOCTYPE html>
<html <?php language_attributes(); ?>>
<head>
<title><?php wp_title( ' | ', true, 'right' ); ?></title>
<link rel="stylesheet" type="text/css" href="<?php echo get_stylesheet_uri(); ?>" />
<script src="http://ift.tt/1q8JMjW"></script>
<link href='http://ift.tt/14vqKcZ' rel='stylesheet' type='text/css'>
<meta name="viewport" content="initial-scale = 1.0,maximum-scale = 1.0" />
<?php wp_head(); ?>
</head>
<body <?php body_class(); ?>>
<!-- Top logo and Search Bar -->
<div class="row header navbar">
<div class="container">
<div class="col-md-3 logo-header hidden-xs hidden-sm">
<a href="<?php echo home_url(); ?>/">
<img src="<?php echo bloginfo('template_directory');?>/img/logo.jpg" alt="map consulting Logo" class="img-responsive">
</a>
</div>
<div class="col-md-3 logo-header hidden-lg hidden-md">
<a href="<?php echo home_url(); ?>/">
<img src="<?php echo bloginfo('template_directory');?>/img/logo.jpg" alt="map consulting Logo" class="img-responsive img-center">
</a>
</div>
<div class="clear"></div>
<div class="col-md-3 pull-right hidden-xs hidden-sm">
<form role="search" method="get" id="searchform" action="<?php echo home_url( '/' ); ?>">
<div class="input-group add-on">
<input type="text" class="form-control" placeholder="Search" name="s">
<div class="input-group-btn">
<button class="btn btn-default" type="submit"><i class="glyphicon glyphicon-search"></i></button>
</div>
</div>
</form>
</div> <!-- end of col md 3 -->
<!-- Navigation for Phone and Tablet - hidden on large screens -->
<div class="row hidden-lg hidden-md" id="mobileSearch" style="margin-bottom:10px;">
<div class="col-xs-12">
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<div class="col-xs-12">
<?php wp_nav_menu( array( 'theme_location' => 'main-menu',
'depth' => 1,
'container_class' => 'collapse navbar-collapse',
'menu_class' => 'nav navbar-nav') ); ?>
</div>
</div>
</div>
<!-- Navbar for large screens, hidden when on phone or tablet -->
<div class="col-md-4 hidden-xs hidden-sm site-title pull-right">
<div class="navbar-header">
<?php wp_nav_menu( array( 'theme_location' => 'main-menu',
'depth' => 1,
'container_class' => 'nav-large',
'menu_class' => 'nav navbar-nav') ); ?>
</div> <!-- navbar collapse -->
</div> <!-- navbar header -->
</div> <!-- col md 4 -->
</div> <!-- end of container -->
Aucun commentaire:
Enregistrer un commentaire