CSS навигационная панель фиксированная, не может прокручиваться

У меня есть панель навигации, которую я хочу спуститься, если я прокручу.
Вот почему я дал здесь position: fixed;CSS навигационная панель фиксированная, не может прокручиваться

Теперь, если я изменить размер моего окна браузера, я не могу видеть ссылки на правой стороне (я не могу прокручивать панель навигации с правой стороны). Я думаю, что это потому, что position: fixed;, но я не знаю, как это исправить.

Вот мой код:

*{ 
 
    margin: 0px; 
 
    padding: 0px; 
 
    font-family: 'Oswald', sans-serif; 
 
} 
 

 
body{ 
 
    height: 2000px; 
 
    background-color: rgb(35, 35, 38); 
 
} 
 

 
nav{ 
 
    width: 100%; 
 
    background-color: rgb(14, 14, 14); 
 
    overflow: hidden; 
 
    border-bottom: 2px solid black; 
 
    margin-bottom: 5px; 
 
    position: fixed; 
 
    top: 0; 
 
} 
 

 
.nav-top-ul{ 
 
    font-size: 0px; 
 
    width: 1000px; 
 
    margin: 0px auto; 
 
} 
 

 
section{ 
 
    margin: 0px auto; 
 
    width: 1000px; 
 
    margin-top: 50px; 
 
    word-wrap: break-word; 
 

 
} 
 

 
.nav-top-li{ 
 
    display: inline-block; 
 
} 
 

 
.nav-top-a{ 
 
    display: block; 
 
    font-size: 16px; 
 
    padding: 10px 20px; 
 
    color: rgb(137, 137, 137); 
 
    transition: all 0.5s; 
 
    text-decoration: none; 
 
} 
 

 
.nav-top-a:hover{ 
 
    color: white; 
 
} 
 

 
.right{ 
 
    float: right; 
 
} 
 

 
.left{ 
 
    float: left; 
 
}

<!DOCTYPE html> 
 
<html lang="en"> 
 
    <head> 
 
     <meta charset="utf-8"> 
 
     <title>Seite</title> 
 
     <link href='http://fonts.googleapis.com/css?family=Oswald' rel='stylesheet' type='text/css'> 
 
     
 
    </head> 
 
    <body> 
 
     <nav> 
 
      <ul class="nav-top-ul"> 
 
       <div class="left"> 
 
        <li class="nav-top-li"><a class="nav-top-a" href="index.php?content=home">NameDerSeite</a></li> 
 
       </div> 
 
       <div class="right"> 
 
        <li class="nav-top-li"><a class="nav-top-a" href="index.php?content=home">Login</a></li> 
 
        <li class="nav-top-li"><a class="nav-top-a" href="index.php?content=home">Register</a></li> 
 
       </div> 
 
      </ul> 
 
     </nav> 
 
     
 
     <section> 
 
      <p>Example... Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...Example...</p> 
 
     </section> 
 
    </body> 
 
</html>

источник

2015-03-17 Skeptar

Это не имеет ничего общего с position: fixed. Вы просто установите ширину навигационной панели в 1000px. Установите его на 100%, и все будет в порядке.

.nav-top-ul{ 
    font-size: 0px; 
    width: 1000px; // Change this to 100% 
    margin: 0px auto; 
}

источник

2015-03-17 16:01:22 dayuloli

Спасибо за ответ, но должен быть Панель навигации только 1000px долго – Skeptar

Если это должно быть * самое * '1000px' долго, а затем использовать' макс-ширина: 1000px; ширина: 100%; ' – dayuloli

Спасибо за ответ! :) – Skeptar

Добавить:

position: fixed; 
    right: 5px;

к .right CSS.

.right { 
float: right; 
position: fixed; 
right: 5px; 
}

источник

2015-03-17 16:03:27

Спасибо за ответ, но навигационная панель должна быть длиной 1000 пикселей: s – Skeptar

CSS навигационная панель фиксированная, не может прокручиваться

ответ

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