Internet Explorer не показывает мою страницу, как она выглядит в браузерах Firefox и Chrome
Internet Explorer не показывает мою страницу html5, как она выглядит в браузерах Firefox и Chrome. Я пробовал все вещи, как html5shiv, response.js, modernizr, но это не решает мою проблему. Также хочу отметить, что я использую Boosttrap 3.
Мой оригинальный HTML-файл:
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Website & Web Application Development in India | SEO Company in India</title>
<link href='http://fonts.googleapis.com/css?family=Roboto:100,300,500,600,700,800,900' rel='stylesheet' type='text/css'>
<link href='http://fonts.googleapis.com/css?family=Open+Sans:400,300,600,700,800,900' rel='stylesheet' type='text/css'>
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.css" rel="stylesheet">
</head>
<body>
<!-- Header -->
<nav class="navbar navbar-inverse navbar-fixed-top">
<div class="container">
<div class="navbar-header">
<!-- Toggle Button -->
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-ex1-collapse">
<span class="sr-only">Toggle navigation</span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button> <!-- End Toggle Button -->
<!-- Logo -->
<a class="navbar-brand" href="#"><img src="img/logo.png" alt="Gayatri Global Group Logo"></a>
<hgroup>
<h5>GAYATRI GLOBAL SERVICES PVT. LTD.</h5>
<h6>Software Development Made SYSTEMATIC</h6>
</hgroup>
<!-- End Logo -->
</div>
<!-- Navigation Menus -->
<div class="collapse navbar-collapse navbar-ex1-collapse" id="mymenu">
<ul class="nav navbar-nav navbar-right">
<li><a class="current" href="index.html">Home</a></li>
<li class="dropdown serv">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Services</a>
<!-- Dropdown Level1 -->
<ul class="dropdown-menu">
<li class="top-arrow"><a href="software-development-companies.html">Software Development Companies</a></li>
<li class="dropdown-submenu bottom-corner"><a tabindex="-1" href="#">Individual Companies</a>
<!-- Dropdown Level2 -->
<ul class="dropdown-menu">
<li class="top-arrow"><a tabindex="-1" href="web-design.html">Web Design & Development</a></li>
<li class="middle-corner"><a href="seo.html">SEO Services</a></li>
<li class="bottom-corner"><a href="web-hosting.html">Web Hosting</a></li>
</ul> <!-- End Dropdown Level2 -->
</li>
</ul> <!-- End Dropdown Level1 -->
</li>
<li><a href="training-hr.html">Training & HR</a></li>
<li><a href="portfolio_page1.html">Portfolio</a></li>
<li class="dropdown serv">
<a class="dropdown-toggle" data-toggle="dropdown" href="#">Packages</a>
<!-- Dropdown Level1 -->
<ul class="dropdown-menu">
<li class="top-arrow"><a tabindex="-1" href="packages.html">Web Design & Development</a></li>
<li class="middle-corner"><a href="#">SEO Services</a></li>
<li class="bottom-corner"><a href="#">Web Hosting</a></li>
</ul> <!-- End <!-- Dropdown Level1 -->
</li>
<li><a href="contact.html">Contact Us</a></li>
</ul>
</div> <!-- End Navigation Menus -->
</div> <!-- End container -->
</nav> <!-- End Header -->
<div class="jumbotron">
<!-- Phone Icon -->
<div class="button_wrap">
<a class="button_aLeft" id="button_aLeft"><span>+91 9326898461</span></a>
<a class="button_bLeft slidebttn" id="button_bLeft"></a>
</div> <!-- End Phone Icon -->
<div>
<a href="http://tympanus.net/codrops/2010/02/08/awesome-css3-jquery-slide-out-button" class="back"></a>
</div>
<div class="container">
<div class="myslider">
<h1>Hello!</h1>
<p class="slider-para">
Gayatri Global Services Pvt. Ltd. is a software development company with expertise in <span class="text-effect02">designing and developing great websites</span> and <span class="text-effect02">software applications</span>. All our activities are conducted with the aim of being the <span class="text-effect02">best development partner</span> you could find for your <span class="text-effect02">software development</span> needs. The directors of GGS Pvt.Ltd. while developing a software CRM product for a UK based company, realised the need for <span class="text-effect02">developing software as a process</span> where the end result is predictable. Our services are aimed towards two distinct markets <br /><br /><span class="text-effect05"> 1) Software development companies and company I.T. departments who would benefit from software outsourcing<a href="#">....</a></span><br /><br /><span class="text-effect05">2) Individual companies who want a quality website design and related services such as SEO and web hosting.</span>
</p>
</div>
</div>
</div>
<div class="container">
<!-- Our Team -->
<div class="services">
<h1>Meet Our Team</h1>
<p class="services-para">
Our belief that only happy employees can make happy customers is the guiding principal behind all our HR activities.See what your software development partners have to say about the company they work for.....
</p>
<div class="row">
<div class="col-md-6">
<h2>
<div class="team-person-title">
<img src="img/pravin.png" class="services-img-left" alt="Pravin"/>
<h3>Pravin</h3>
<h4>Sr.Manager - HR</h4>
</div>
</h2>
<div class="tip left">
<p class="quote01">
Our belief that only happy employees can make happy customers is the guiding principal behind all our HR activities."
</p>
</div>
</div>
<div class="col-md-6">
<h2>
<div class="team-person-title">
<img src="img/omkar.png" class="services-img-right" alt="Omkar"/>
<h3>Omkar</h3>
<h4>Web Developer</h4>
</div>
</h2>
<div class="tip left">
<p class="quote04">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
</p>
</div>
</div>
</div> <!-- End first row -->
<div class="row">
<div class="col-md-6">
<h2>
<div class="team-person-title">
<img src="img/tanaji.png" class="services-img-left" alt="Tanaji"/>
<h3>Tanaji</h3>
<h4>Web Designer</h4>
</div>
</h2>
<div class="tip left">
<p class="quote03">
Morbi semper eros sed interdum adipiscing. Etiam aliquam facilisis eros nec hendrerit. Vestibulum quis viverra orci."
</p>
</div>
</div>
<div class="col-md-6">
<h2>
<div class="team-person-title">
<img src="img/aniket.png" class="services-img-right" alt="Aniket"/>
<h3>Aniket</h3>
<h4>SEO Expert</h4>
</div>
</h2>
<div class="tip left">
<p class="quote02">
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua."
</p>
</div>
</div>
</div> <!-- End 2nd row -->
</div> <!-- End Our Team -->
</div>
<div class="works">
<div class="container">
<div class="sub-works">
<div class="sub-works-top">
<h1>Work Process</h1>
<p id="for-hr" style="margin-top:-30px">
Our Process is based on our SHARP working methodology. For us this is not some corporate theory but simply a way we do all our work. All the work that we carry out will be
</p>
</div>
<div class="container">
<div class="row">
<div class="col-lg-2 col-md-2"> <!-- Pencil -->
<img src="img/sharp.png" class="img-responsive" style="margin-top:20px"> <!-- End Pencil -->
</div>
<div class="col-lg-10 col-md-10"> <!-- SHARP -->
<div class="media">
<div class="pull-left">
<img class="media-object" src="img/s-for.png"/>
</div>
<h4>PEEDY</h4>
<div class="media-body">
<p> - The work will be done as fast as possible.</p>
</div>
</div>
<div class="media">
<div class="pull-left">
<img class="media-object" src="img/h-for.png">
</div>
<h4 class="media-heading">ONEST</h4>
<div class="media-body">
<p> - We will always work in the best interest of our customer.</p>
</div>
</div>
<div class="media">
<div class="pull-left">
<img class="media-object" src="img/a-for.png">
</div>
<h4 class="media-heading">CCURATE</h4>
<div class="media-body">
<p> - Work in a way as to eliminate all errors.</p>
</div>
</div>
<div class="media">
<div class="pull-left">
<img class="media-object" src="img/r-for.png">
</div>
<h4 class="media-heading">ELIABLE</h4>
<div class="media-body">
<p> - The technology that we use and our coding will be reliable. The process we use means you will get the same reliable result each time, every time.</p>
</div>
</div>
<div class="media">
<div class="pull-left">
<img class="media-object" src="img/p-for.png">
</div>
<h4 class="media-heading">UNCTUAL</h4>
<div class="media-body">
<p> - Once we agree a deadline with our customer, it will be met----whatever happens.</p>
</div>
</div>
</div> <!-- End SHARP -->
</div> <!-- End Row -->
</div> <!-- /container -->
</div> <!-- /sub-works -->
</div> <!-- /container -->
</div> <!-- works -->
<div class="section-colored">
<div class="container">
<div class="row">
<div class="col-lg-6 col-md-6 col-sm-6">
<h2>We are Present in</h2>
<h3>Office</h3>
<p> 1st Floor, 931/1, <br />
Sham Co-Operative Housing Society,<br />
Near Crusher Chowk, <br />
Radhanagari Road,<br />
Kolhapur- 416012<br /><br />
Phone - +91-9326898461<br /><br />
Email - Info@gayatriglobalgroup.in
</p>
<br /><br />
</div> <!-- End Address -->
<div class="col-lg-6 col-md-6 col-sm-6">
<h2>Keep in Touch</h2>
<form method="post" action="mail.php" name="form1" id="form1">
<input type="text" class="span3" placeholder="Name*" name="name">
<input type="text" class="span3" placeholder="Phone*" name="phone">
<input type="text" class="span3" placeholder="Email*" name="email">
<textarea type="text" class="span3" placeholder="Message" name="message"></textarea>
</form>
<button class="btn-submit">Submit</button>
</div> <!-- End form -->
</div> <!-- /row -->
</div> <!-- /container -->
</div> <!-- /section-colored -->
<footer>
<div class="container">
<div class="footer-text">
© Gayatri Global Services Pvt. Ltd. | Privacy
</div>
<div class="social">
<a href="#"><img src="img/google+.png" width="32" height="31" alt="Google+"></a>
<a href="#"><img src="img/facebook.png" width="33" height="31" alt="Facebook"></a>
<a href="#"><img src="img/twitter.png" width="33" height="31" alt="Twittwer"></a>
<a href="#"><img src="img/linkedin.png" width="33" height="31" alt="Linkedin"></a>
</div>
</div>
</footer> <!-- end footer -->
</body>
<!-- JavaScript -->
<script src="js/jquery-1.10.2.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="js/bootstrap.js"></script>
<script type="text/javascript">
$(function() {
$('.slidebttn').hover(
function () {
var $this = $(this);
var $slidelem = $this.prev();
$slidelem.stop().animate({'width':'225px'},1000);
$slidelem.find('span').stop(true,true).fadeIn();
$this.addClass('button_c');
},
function () {
var $this = $(this);
var $slidelem = $this.prev();
$slidelem.stop().animate({'width':'30px'},1000);
$slidelem.find('span').stop(true,true).fadeOut();
$this.removeClass('button_c');
}
);
});
</script>
</html>
Ребята плз помогите мне.