如何做navbar固定？

我試圖做我的導航欄固定的，但是當我添加position:fixed到CSS如何做navbar固定？

.grid__header { 
position:fixed; 
min-height: 164px; 
height: 164px; 
width:100%; 
display: -webkit-flex; 
display: flex; 
background: transparent; 
-webkit-flex-direction: row; 
-ms-flex-direction: row; 
flex-direction: row; 
-webkit-justify-content: space-between; /* Safari 6.1+ */ 
justify-content: space-between; 
}

容器類不wihin .grid__header工作它流走了。如何解決它？

Codepen code

來源

2016-06-28 Slip

當您將添加position:fixed會向左移動，使之中心，以下CSS添加到.grid__header

position:fixed; left:0; right:0;

來源

2016-06-28 05:43:07

'左：0;'和'右：0;'是不夠好。您無需將右側和左側邊距設置爲自動。 –

是的正確，保證金不需要..更新 –

是的，你是對的！謝謝。但如何處理z-index（當我打開菜單 - 關閉按鈕不起作用）？ – Slip

Position需要從left和top指定其現在的位置。

.grid__header { 
 
    position:fixed; 
 
    left:0; right:0; 
 
    min-height: 164px; 
 
    height: 164px; 
 
    width:100%; 
 
    display: -webkit-flex; 
 
    display: flex; 
 
    /* background: transparent; */ 
 
    
 
    background:#ccc; 
 
    -webkit-flex-direction: row; 
 
    -ms-flex-direction: row; 
 
    flex-direction: row; 
 
    -webkit-justify-content: space-between; /* Safari 6.1+ */ 
 
    justify-content: space-between; 
 
    } 
 
/*##setting height just for display##*/ 
 
body{height:1500px;margin:0;padding:0;}

<header class="grid__header"></header>

來源

2016-06-28 05:47:38

如何做navbar固定？

回答

相關問題