Содержимое верхнего и нижнего колонтитула - Bootstrap

Question

Я использую Bootstrap Cover Template, чтобы сделать чистый сайт с небольшим количеством контента: в основном текст и изображение.

Верхний и нижний колонтитулы накладывания содержание веб-сайта, как вы можете видеть на скриншоте:

Сайт: merdanacabeca.com/adrenalina/

Что является лучшим решением в этом случае? Медиа-запрос?

Я знаю, что могу добавить верхний край к содержимому <div> и изменить положение нижнего колонтитула на статический, а не фиксированный. Однако это приводит к другим проблемам при разных разрешениях экрана (например, меньше).

Я ищу наилучший подход.

Answer 1

Проблема возникает из фиксированного положения .masthead & .mastfoot classes.

Попробуйте удалить фиксированное положение .mastfoot и следующий за .masthead и .Накрыть:

.masthead { 
    position: fixed; 
    top: 0; 
    background: #333333; 
} 

.cover { 
    padding: 0 20px; 
    margin-top: 115px; 
} 

Answer 2

, если я понял ваш вопрос правильно, вы пытаетесь остановить колонтитул с текстом «Desenvolvido por ... "от наложения этой белой кнопки (исправьте меня, если нет).

ну, из-за padding-bottom класса .inner, который стоит там. вы можете уменьшить это ...

тоже я не думаю, что вам нужно position: fixed для нижнего колонтитула. потому что обычно он остается в нижней части страницы.

вы также можете назначить margin-top к <div class="inner cover">, чтобы проблема с заголовком уйти