2014-10-08 185 views
0

我通過Plural Sight上的視頻跟蹤,無法讓導航欄停止隱藏我的文字(或我的文字在導航欄下移動)。手寫筆導航欄覆蓋文字

Navbar covering text

我有一個styl片如下:

body 
    padding-top 61px 

.navbar-header a.navbar-brand 
    margin-top -15px 
    margin-bottom -20px 
    h6 
    color #ccc 

footer 
    padding-left 15px 
    padding-right 15px 
    p 
    border-top 1px solid #d7e0e2 

index.jade一個如下:

extends ../includes/layout 

block main-content 
    .navbar.navbar-inverse.navbar-fixed-top 
     .container 
      .navbar-header 
       a.navbar-brand(href="/") MEAN Stack Tutorial 
        h6 -Extreme Tech Training 
     .navbar-collapse.collapse 
      .ul.nav.navbar-nav 
       li 
        a(href="/") Home 

    section.content 
     div(ng-view) 
    h2= mongoMessage 

     footer.container.text-center 
      p © 2014 BanksyCorp 

,最後一個layout.jade

doctype html 
html 
    head 
     title MEAN Stack Tutorial 
     base(href="/") 
     link(href='/favicon.ico', rel='shortcut icon', type='image/x-icon') 
     link(rel='stylesheet', href='/css/bootstrap.css') 
     link(rel='stylesheet', href='/vendor/toastr/toastr.css') 
     link(rel='stylesheet', href='/css/site.css') 
    body(ng-app='app') 
     block main-content 
     include scripts 

上的視頻的例子,此代碼應使內容出現在導航欄下方,就像這樣:

Correct formatting

我知道styl文件被解析爲我可以改變它的一些性質,看看它在瀏覽器中發生變化。

回答

1

這是因爲你有一個navbar-fixed-top類,它具有position: fixed屬性(塊內容超出正常流程)。