使用css位置时,导航栏在所有浏览器中消失:fixed;

时间:2015-01-30 16:44:02

标签: html css angularjs

您好我一直在搞乱代码,而在这里看了类似的帖子,但示例/解决方案不起作用。

我有一个导航栏,当用户向下滚动时,我想将其固定到它的位置。看起来很简单?除了我使用时:

position: fixed;

它会使导航栏短暂显示然后消失。

当我使用z索引时......它会将导航栏向下移动到左边!?

这是我的孤立代码:

感谢。

的style.css

html {
 min-height:100%;
  overflow-x:hidden;
  overflow-y:scroll;
  position:relative;
  width:100%;
background-color:#000;

}
body {
  background-color:000;
  font-family:"Verdana", sans-serif; color:#c4c4c4; font-size:16.0px; line-height:1.19em;
  color:#000;
  font-weight:100;
  margin:0px;
 min-height:100%;
  width:100%;
}


header .nav {
  float:right;
  position: fixed;
 margin-top: 60px;
background-image: -webkit-gradient(
        linear,
        left bottom,
        right bottom,
        color-stop(0, #000000),
        color-stop(1, #71399E)
);
background-image: -o-linear-gradient(right, #000000 0%, #71399E 100%);
background-image: -moz-linear-gradient(right, #000000 0%, #71399E 100%);
background-image: -webkit-linear-gradient(right, #000000 0%, #71399E 100%);
background-image: -ms-linear-gradient(right, #000000 0%, #71399E 100%);
background-image: linear-gradient(to right, #000000 0%, #71399E 100%);
}

的index.html

  <header>





    <div class="wrap">
      <!-- logo -->

       <a href="#!"><img class="logo" src="img/history_00.png" /></a>
  <h7>Building lasting relationships<h7>



<ng-controller = "demoCtrl">

<ul class="nav nav-pills pull-right">



      <li ng-class="{active: isState('home') }">
        <a ui-sref="home">HOME</a>
      </li>
      <li ng-class="{active: isState('form') }">
        <a ui-sref="form">CANDIDATES</a>
      </li>
       <li ng-class="{active: isState('clients') }">
        <a ui-sref="clients">CLIENTS</a>
      </li>
       <li ng-class="{active: isState('aboutus') }">
       <a ui-sref="aboutus">ABOUT US</a>
      </li>

      <li ng-class="{active: isState('training') }">
        <a ui-sref="training">TRAINING</a>
      </li>


    </ul>
    <h3 class="text-muted">          </h3>
    <br>
</div>

0 个答案:

没有答案