Неподходящий нижний колонтитул

Question

У меня есть нижний колонтитул, который хорошо остается внизу. Но я заметил, что когда я прокручиваю, он проходит над некоторыми элементами, но проходит под другим элементом, что выглядит очень странно. Я не понимаю, почему это так.

footer {
    background: linear-gradient(to right, #ffffff 0%, #000066 100%);
    border-style: outset;
    border-width: 10px;
    border-color: #060675;
    text-align: center;
    font-size: 15px;
    position: fixed;
    bottom: 0;
    height: 80px;
    width: 100%;
  }

Я хотел бы иметь нижний колонтитул, охватывающий все содержимое. Это про позиционирование absolute и relative. Это может быть связано с тем, что некоторые элементы расположены относительно друг друга, а некоторые я не указал, поэтому по умолчанию они позиционируются относительно, но нижний колонтитул идет вверх, а не вниз.

Как я могу go об этом?

Answer 1

вам нужно будет добавить z-index, который обрабатывает слои в CSS ..

Свойство z-index определяет порядок стека элемента.

Элемент с большим порядок стека всегда перед элементом с более низким порядком стека.

footer {
    background: linear-gradient(to right, #ffffff 0%, #000066 100%);
    border-style: outset;
    border-width: 10px;
    border-color: #060675;
    text-align: center;
    font-size: 15px;
    position: fixed;
    z-index: 10; /* higher the number the more upper layer it will go*/
    bottom: 0;
    height: 80px;
    width: 100%;
  }