Teleporting css панель навигации?

Question

так я работаю с CSS, который я сосу с, и я получил свой код, чтобы работать так, как я хочу, так что я не ищу Снарки комментарии говоря мое кодирование отстоя: P

В любом случае я использовал GIF просто показать, что он делает - я также предоставил код внизу.

https://gyazo.com/3756eb0c3b6246d8b8f74cad6614839a

Привязок рода телепорт при нажатии на IE нажмите один является последней позиции, и ни один шаг, нажмите один в первом говорят все движение влево на один «ссылка пространства» Я не знаю, как объяснить это, так извините, что у меня есть ха-ха. В любом случае вот код. Вместо использования файла styles.css я просто использую раздел стиля моего index.html. Я собираюсь опубликовать всю свою область стиля на всякий случай, если это может быть противоречиво, я буду разделять, где он заканчивается. navbar, но просто для упрощения просмотра.

ul { 
    list-style-type: none; 
    margin: 190px; 
    overflow: hidden; 
    text-align: center; 
    text-decoration: line-through; 
} 

li { 
    list-style-type: none; 
    float: left; 
    padding-left: 30px; 
    display: inline-block; 
} 

a { 
    list-style-type: none; 
    display: block; 
    width: 0%; 
    background-color: #757575; 
    font-size: 36px; 
} 

Кажется, я не могу мимо другой участок кода здесь, так что я буду Pastebin это вместо:

Pastebin коды после навигационной панели: pastebin/w1J1Yixu

Pastebin из ПОЛНОГО кода, включая навигационную панель : pastebin/K4ngr4MN

Answer 1

Это потому, что у вас есть position:fixed; на вашем a:active декларации в вашем «код после того, как» навигационной панели

Что это значит, установите координату x и y ссылки на ее точное смещение относительно документа при нажатии любой ссылки на странице. Таким образом, остальная часть ссылок, считая, что их фиксированный положением родственник больше не находится в относительном потоке, выравнивается влево, занимая теперь пустое пространство, в котором была использована ссылка.

Чтобы исправить это, удалите из декларации стиль position:fixed;.

a:active { color: #1DFA3D; text-align: right; z-index: 9999; text-decoration: none; }

Вот скрипку из после: http://jsfiddle.net/yo3L5qdy/