我从我继承的网站获得了以下page。当我尝试不同的窗口大小时，一切都很好，但如果我在Chrome中切换到移动视图，则div开始浮动在页面顶部。
我只是不明白是什么导致这种情况发生的。
{% load staticfiles %}
<!doctype html>
<head>
<meta charset="utf-8">
<title>www</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
<link rel="shortcut icon" href="static/favicon.ico">
<link rel="stylesheet" href="/static/bower_components/bootstrap/dist/css/bootstrap.css">
<link rel="stylesheet" href="/static/StudioHanel/styles/main.css">
<!-- endbuild -->
<!-- build:js scripts/vendor/modernizr.js -->
<script src="{% static "bower_components/modernizr/modernizr.js" %}"></script>
<!-- endbuild -->
</head>
<body onLoad="studioHanel.StudioHanel()">
<!--[if lt IE 10]>
<p class="browsehappy">You are using an <strong>outdated</strong> browser. Please <a href="http://browsehappy.com/">upgrade your browser</a> to improve your experience.</p>
<![endif]-->
<div class="navbar-fixed-top">
<img class="logo" src="{% static "images/logo_large.png" %}" alt="Studio Hanel"/>
<ul id="menu" class="nav nav-pills pull-right"></ul>
</div>
<div id="landing">
</div>
<div id="teaser-about" class="teaser">
<h1></h1>
<div class="arrow"></div>
</div>
<div id="about">
<div class="container-fluid">
<div class="header"></div>
<h1></h1>
<div class="container">
<div class="row">
<div id="about-copy-column" class="col-md-8"><div class="two-columns"></div></div>
<div id="about-photo-column" class="col-md-4"><img src="{% static "images/cordelia_old.png" %}" width="244" height="274"></div>
</div>
</div>
</div>
</div>
<div id="interiors">
<div class="container-fluid"></div>
</div>
<div id="teaser-interiors" class="teaser">
<div class="shadow-up"></div>
<div class="pattern"></div>
<h2></h2>
<div class="shadow-down"></div>
<div class="arrow"></div>
</div>
<div id="case-study">
<div class="container-fluid">
<div class="row">
<div id="cell1" class="col-lg-6 col-md-6 col-sm-12 col-xs-12"></div>
<div id="cell2" class="col-lg-6 col-md-6 col-sm-12 col-xs-12"></div>
</div>
<div class="row">
<div id="cell3" class="col-lg-6 col-md-6 col-sm-12 col-xs-12"></div>
<div id="cell4" class="col-lg-6 col-md-6 col-sm-12 col-xs-12"></div>
</div>
<div class="row">
<div id="cell5" class="col-lg-6 col-md-6 col-sm-12 col-xs-12"></div>
<div id="cell6" class="col-lg-6 col-md-6 col-sm-12 col-xs-12"></div>
</div>
</div>
</div>
<div id="product-design">
</div>
<div id="teaser-contact" class="teaser">
<h2></h2>
<div class="arrow"></div>
</div>
<div id="contact-util"></div>
<div id="contact">
<div class="container">
<div class="row">
<div class="col-md-7" id="contact-form">
<form name="contact" action="" method="">
<fieldset>
<input id="name" class="text-input" type="text" name="name" placeholder="Your name">
<input id="email" class="text-input" type="text" name="sender" placeholder="Your email">
<input id="message" class="text-input" type="text" name="message" placeholder="What's on your mind?">
<label id="error"></label>
<input id="send" class="button" type="button" value="Send">
<!--<input id="send" class="button" name="submit" value="Send">-->
</fieldset>
</form>
</div>
<div class="col-md-4">
<div id="contact-details">
<div id="phone" class="contact-details"></div>
<div id="address" class="contact-details"></div>
</div>
</div>
</div>
</div>
<div class="shadow-up"></div>
<div class="pattern"></div>
</div>
<div id="copyright">
<p>© Studio Hanel 2014 All rights reserved including all imagery as shown on this website</p>
</div>
<!-- build:js scripts/vendor.js -->
<!-- bower:js -->
<script src="{% static "bower_components/jquery/dist/jquery.js" %}"></script>
<!-- <script src="{% static "bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap.js" %}"></script> -->
<script src="{% static "bower_components/bootstrap-sass/assets/javascripts/bootstrap.js" %}"></script>
<!-- <script src="{% static "bower_components/greensock/src/uncompressed/TweenMax.js" %}"></script> -->
<script src="{% static "bower_components/gsap/src/uncompressed/TweenMax.js" %}"></script>
<!-- <script src="{% static "bower_components/greensock/src/uncompressed/plugins/ScrollToPlugin.js" %}"></script> -->
<script src="{% static "bower_components/gsap/src/uncompressed/plugins/ScrollToPlugin.js" %}"></script>
<!-- <script src="{% static "bower_components/modernizr/feature-detects/css/scrollbars.js" %}"></script> -->
<!-- endbower -->
<!-- endbuild -->
<!-- Google Analytics: change UA-XXXXX-X to be your site's ID. -->
<script>
(function(b,o,i,l,e,r){b.GoogleAnalyticsObject=l;b[l]||(b[l]=
function(){(b[l].q=b[l].q||[]).push(arguments)});b[l].l=+new Date;
e=o.createElement(i);r=o.getElementsByTagName(i)[0];
e.src='//www.google-analytics.com/analytics.js';
r.parentNode.insertBefore(e,r)}(window,document,'script','ga'));
ga('create','UA-XXXXX-X');ga('send','pageview');
</script>
<!--
<script src="{% static "bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/affix.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/alert.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/dropdown.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/tooltip.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/modal.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/transition.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/button.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/popover.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/carousel.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/scrollspy.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/collapse.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass-official/vendor/assets/javascripts/bootstrap/tab.js" %}"></script> -->
<!-- build:js scripts/plugins.js -->
<script src="{% static "bower_components/bootstrap-sass/assets/javascripts/bootstrap/affix.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass/assets/javascripts/bootstrap/alert.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass/assets/javascripts/bootstrap/dropdown.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass/assets/javascripts/bootstrap/tooltip.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass/assets/javascripts/bootstrap/modal.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass/assets/javascripts/bootstrap/transition.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass/assets/javascripts/bootstrap/button.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass/assets/javascripts/bootstrap/popover.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass/assets/javascripts/bootstrap/carousel.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass/assets/javascripts/bootstrap/scrollspy.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass/assets/javascripts/bootstrap/collapse.js" %}"></script>
<script src="{% static "bower_components/bootstrap-sass/assets/javascripts/bootstrap/tab.js" %}"></script>
<!-- endbuild -->
<!-- build:js({app,.tmp}) scripts/main.js -->
<script src="{% static "scripts/utils.js" %}"></script>
<script src="{% static "scripts/landing.js" %}"></script>
<script src="{% static "scripts/about.js" %}"></script>
<script src="{% static "scripts/interiors.js" %}"></script>
<script src="{% static "scripts/case_study.js" %}"></script>
<script src="{% static "scripts/product_design.js" %}"></script>
<script src="{% static "scripts/contact.js" %}"></script>
<script src="{% static "scripts/menu.js" %}"></script>
<script src="{% static "scripts/navigation.js" %}"></script>
<script src="{% static "scripts/main.js" %}"></script>
<!-- endbuild -->
</body>
</html>
的main.css 因大尺寸而无法张贴。
可以从here
下载答案 0 :(得分：0)
问题似乎是徽标和导航条重叠。
要解决此问题，您可以使用div包装徽标并使用bootstrap的类hidden-xs，如下所示：
<div class="navbar-fixed-top">
<div class="hidden-xs">
<img class="logo" src="{% static "images/logo_large.png" %}" alt="Studio Hanel"/>
</div>
<ul id="menu" class="nav nav-pills pull-right"></ul>
</div>