Bootstrap navbar не двигается вниз при прокрутке

Я искал ответы здесь и на нескольких других сайтах. Там были некоторые, но я не могу заставить его работать. У меня есть следующий навигатор:Bootstrap navbar не двигается вниз при прокрутке

<nav class="navbar"> 
    <a href="#About">About me</a> 
    <a href="#Education">Education</a> 
    <a href="#Portfolio">Portfolio</a> 
    <a href="#Contact">Contact</a> 
</nav>

Я пробовал его с контейнером div и без него на внутренней стороне навигационных меток.

Вот соответствующий CSS:

nav { 
    text-align: center; 
    position: fixed; 
    top: 0; 
    lef: 0; 
    right: 0; 
    height: 35px; 
    padding-top: 15px; 
    box-shadow: 0px 0px 8px 0px; 
    -webkit-box-shadow: 0px 0px 8px 0px; 
    -moz-box-shadow: 0px 0px 8px 0px; 
    background-color: gray; 
    width: 100%; 
    z-index: 100; 
}

Я также попробовал без Z-индекс: 100; Если кто-то знает, чего мне не хватает, или мне нужно добавить что-то еще, мне будет интересно узнать, что это такое и где я могу это прочитать, чтобы получить его.

Спасибо :)

источник

2016-03-15 Joseph

Что именно вы подразумеваете под словом «не двигаясь вниз» и что вам нужно? Должна ли navbar оставаться в верхней части окна, пока контент прокручивается под ним или должен ли он прокручиваться вместе с содержимым? – Johannes

Хорошо. Для уточнения, тогда. Когда я прокручиваю вниз, навигационная панель вверху страницы исчезает над экраном. Я хочу, чтобы он оставался на вершине экрана независимо от того, где я прокручиваю до – Joseph

хм - это то, что «фиксированный» должен делать. можете ли вы разместить еще несколько кодов (html страницы, больше css)? – Johannes

У вас есть правило CSS для calss .navbar с position: relative. Это отменяет фиксированную настройку для nav

Добавить !important в своей позиции: фиксированная установка для nav:

nav { 
    text-align: center; 
    position: fixed !important;

и т.д.

Это должно исправить.

http://codepen.io/anon/pen/ZWBwEW

источник

2016-03-16 00:07:07 Johannes

На самом деле ... странно, я этого не делал. Не в кодировке, которую я дал. Либо это, либо я исправил его после факта, потому что он был зафиксирован в nav css. Я, возможно, отредактировал его, поскольку я пытался выяснить, на основании того, что люди говорили мне здесь! В любом случае, как только родственник исчез, он все равно не работает. Тем не менее, ваш! Важно сделать это автоматически, так что tyvm! – Joseph

Правило .navbar для относительного положения, похоже, исходит из самого бутстрапа, я полагаю. Я нашел его с помощью инструментов разработчика браузера. – Johannes

Я законно делал то, что я пытался понять. Я также не знал, что это сработало. Предположим, мне нужно начать выяснять, какие другие вещи по умолчанию, чтобы сохранить себе подобные головные боли в будущем! Хах! Еще раз спасибо! – Joseph

У вас есть положение: исправлено. И опечатка «леф»

источник

2016-03-15 23:39:40 Stuart

Как и выше, я изменил атрибут position, но исправление опечатки поверх этого тоже не помогло мне. – Joseph

Все здесь помогли мне, потому что я есть опечатка, и я есть то, что я пытался сделать правильно, в конце концов.

Спасибо, в частности, Йоханнесу, я понял, что если вы пытаетесь сделать это, как я, и используя Bootstrap, убедитесь, что вы положили! Важно после позиции: fixed; в вашем css, поскольку в этом отношении он переопределяет свойства по умолчанию Bootstraps, в результате чего вам не удается удерживать навигационную панель на экране во время прокрутки вниз!

источник

2016-03-16 00:27:43 Joseph

Bootstrap navbar не двигается вниз при прокрутке

ответ

Смежные вопросы