Нижний колонтитул не останется внизу

-1

Я не смог найти ни одно из решений для работы.Нижний колонтитул не останется внизу

Колонтитул продолжает оставляя зазор в нижней части этого page

Колонтитул оставляет зазор белого пространства.

Я попытался

#footer { 
position:absolute; 
bottom:0; 
}

и, кажется, делают это хуже ...

Есть идеи?

UPDATE: все еще не может заставить его работать. попытался установить высоту тела и обертки. пробовал весь код ниже. и он просто заканчивается перекрытием

источник

2015-03-23 Web Dev

«bottom: 0» относится к нижней части соответствующего родительского элемента. Проверьте высоту html, body и wrapper. – Mario

согласен с первого взгляда, я могу сказать, что все ваши внешние div havo без измерения ... попытайтесь исправить это и реализуете некоторые высоты и ширину. –

Это отзывчивый веб-сайт, который не уверен, почему мне нужно будет определить что-то, что не должно definiton –

Попробуйте это:

#footer { 
    position:fixed; 
    bottom:0; 
    width:100%; 
}

Я считаю, что это то, что вы после этого. Абсолютная позиция относится к документу, тогда как фиксированная позиция относится к экрану.

EDIT

Если предположить, что колонтитул имеет высоту 50px сказать, что вам нужно добавить маржу к элементу, который находится выше нижнего колонтитула в DOM, своего рода обертку идеале, который появляется на каждой странице ваш сайт (это имеет наибольший смысл структурно

Даже если добавить этот элемент себя если у вас есть доступ к шаблону

Так это может выглядеть примерно так:..

<header></header> 
<div class="content"> 
    //wrap all of your main content block here 
</div> 
<footer></footer>

Тогда для CSS добавить margin-bottom:70px к .content обертке

источник

2015-03-23 16:34:32 lharby

Проблема в том, что маленькие экраны будут перекрывать контент с помощью этого кода –

Да, трюк заключается в том, чтобы добавить некоторый запас или отступы к основному блок контента, который, по крайней мере, является высотой вашего нижнего колонтитула. Если вы знаете точную высоту, вы можете сделать это с помощью css. – lharby

Я установил высоту нижнего колонтитула '.footer-wrap { height: 5em; } ' –

Try это ...

#footer-wrap { 
    position: fixed; 
    bottom: 0; 
    width: 100%; 
}

источник

2015-03-23 16:34:44 mituw16

все еще видят пробел –

Здесь вы идете:

#footer { 
    position:fixed; 
    bottom:0; 
    left:0; 
    width:100%; 
}

источник

2015-03-23 16:35:48

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

<style> 
    .footer-wrap{position: absolute; bottom: 0px; width: 100%;} 
    body{overflow: hidden;} 
</style>

Вам нужно добавить переполнения: скрытый на теле, так как ширина 100% на сноске создает горизонтальную прокрутку.

источник

2015-03-23 16:41:21 dukedevil294

Закрыть, но он будет перекрывать контент на меньших экранах –

Колонтитул это автоматически определенный элемент в HTML5 вы базовая страница должна выглядеть, и все должно быть место

<!DOCTYPE html> 
 
<html lang="en"> 
 
<head> 
 
<title>Place title here</title> 
 
<meta charset="utf-8"> 
 
</head> 
 
<body> 
 
<header> 
 
    
 
    </header> 
 
    
 
<nav> 
 
    
 
    </nav> 
 
    
 
<main> 
 
    
 
    </main> 
 
    
 
<footer> 
 
    
 
    </footer> 
 
</body> 
 
</html>

Хорошая конфигурация CSS для каждого может быть что-то вроде

<style> 
 
header { 
 
    background-color:place color here; 
 
    } 
 

 

 
nav { 
 
    background-color:place color here; 
 
    } 
 

 
main { 
 
    background-color:place color here; 
 
    } 
 

 

 
footer { 
 
    background-color:place color here; 
 
    } 
 
</style>

Примечание: верхний и нижний колонтитулы должны быть такой же цвет, как цвет тела делает страницу более презентабельно

источник

2015-03-23 20:45:34

Ну, я просто ухожу от дизайна, который мне дал код. –

я был в состоянии исправить это, установив нижнюю границу на посту

article.post-72.page.type-page.status-publish.hentry { 
    margin-bottom: 124px!important; 
}

и добавить некоторую высоту и переполнение нижнего колонтитула

.footer-wrap { 
    height: 115px; 
    overflow: hidden; 
}

источник

2015-03-24 05:49:37

Этот вопрос мог быть значительно улучшен с помощью jsfiddle. Но добавление нижней границы было моей рекомендацией. – lharby

jsfiddle не сработает. но он не может содержать сайт wordpress. Но только очень маленький фрагмент кода. –

И вы порекомендовали запас или прокладку. Просто не к какой марже или дополнению или к какому элементу. Поэтому я хотел опубликовать свой ответ со спецификой. Спасибо! постскриптум поскольку страницы имеют diff-контент, вы должны применить исправление на странице. –

Возможно, я немного опоздал, но сегодня я наткнулся на это, и я знаю решение для него.

Просто используйте: display:flex;

Это сделает этот белые пространства обращаются в нуль. Надеюсь, это поможет кому-то.

источник

2015-08-13 15:33:10 4127157

Нижний колонтитул не останется внизу

ответ

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