navbar issues

by Viraj Gamage

HTML

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
<nav class="navbar navbar-default navbar-fixed-top">

  <div class="container">
  <div class="row">
    <div class="navbar-header col-xs-7">
      <a class="navbar-brand" href="#">Travel</a>
    </div>
    <div class="col-xs-5">
		<!-- <ul class="nav navbar-nav normal-menu col-xs-8">
			<li class="active"><a href="#">Home</a></li>
			<li><a href="#">Page 1</a></li>
			<li><a href="#">Page 2</a></li>
			<li><a href="#">Page 3</a></li>
		</ul> -->
		
		
	  
		<!-- login dropdown -->
		<ul class="nav navbar-nav pull-right col-xs-6">
		  <li class="dropdown" id="menuLogin">
			<a class="dropdown-toggle login-drop-down" href="#" data-toggle="dropdown" id="navLogin">Login</a>
			<div class="dropdown-menu dropdown-menu-right" style="padding:17px;">
			  <form class="form form-signin" id="formLogin"> 
				<input type="text" class="input-block-level" placeholder="Email address">
				<input type="password" class="input-block-level" placeholder="Password">
				<button class="btn btn-large btn-primary" type="submit">Sign in</button>
			  </form>
			</div>
		  </li>
		</ul><!-- login dropdown end-->
		
		<!-- mobile menu dropdown -->
		<ul class="nav navbar-nav pull-right mobile-menu col-xs-6">
		   <li class="dropdown">
			 <a href="#" class="dropdown-toggle" data-toggle="dropdown">
				<span class="glyphicon glyphicon-align-justify glfcn" aria-hidden="true"></span>
				<!-- <b class="caret"></b> -->
			 </a> 
			 <ul class="dropdown-menu dropdown-menu-right">
			   <li><a href="#">page 1</a></li>
			   <li><a href="#">page 2</a></li>
			   <li><a href="#">page 3</a></li>
			 </ul>
		 ...