2016-03-30 4 views
1

У меня есть дилемма, которая ценит и пытается предложить любое предложение. У меня есть localhost running wordpress, используя тему The Fox. У меня все работает отлично, за исключением нижнего колонтитула.Место Wordpress Footer В конце страницы

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

Screenshot of Sample Page

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

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

Внутри CSS есть секция нижнего колонтитула, и она находится здесь на Pastebin, но я думаю, что самый важный из них таков:

сноска

{ 
bottom:0px; 
right:0; 
left:0; 
overflow:auto; 
padding:0px; 
min-height:70px!important; 
height:auto; 
position: relative; 
z-index: 9000;} 

В сноске, я использую только один столбец, и я думаю, что этот код обрабатывает это ... и в Pastebin.

.footer_1_col .widget_wrap 
    { 
width:100%!important; 
float:none!important; 
margin-left:auto!important; 
margin-right:auto!important; 
padding-right:10px!important; 
} 

А от типа колонтитула, я использую тип 8, который использует код;

/************************************************** 
Footer Type 8 

**************************************************/ 
    .footer_type_8 .widget_wrap { 
    margin: 10px 0px 0px 0; 
    } 
    .footer_type_8 .widget { 
    margin:0px 0px 0px 0; 


} 
.footer_type_8 .widget h2 { 
font-size:10px; 
text-transform:uppercase; 
font-weight:900; 
letter-spacing:normal; 
line-height:14px; 
margin-bottom:0px; 
padding-left:0px; 
position: fixed; 
} 
.footer_type_8 .widget_line { 
display:none; 
} 

Пожалуйста, что я делаю неправильно, и где мне нужно внести изменения? Если вам нужно увидеть какой-нибудь другой код, сообщите мне, и я отправлю его на pastebin.

Спасибо.

+0

Я бы постарался положить 'min-height: 95vh' на контейнер, который обтекает содержимое, над нижним колонтитулом. – firasd

+0

@firasd Я сделал это, но дал дополнительную пробел на каждой странице. –

+0

Даже страницы с достаточным количеством контента, чтобы подтолкнуть нижний колонтитул? – firasd

ответ

0

Особая благодарность @Firasd за его комментарии, которые сделали это возможным.

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

Это был добавлен в Пейджа CSS Раздел

html,body {height:100%;}#fw_c { min-height: calc(100vh - 162px);} 

Тема использует Bakerly Визуальная композитора, и я просто должен был добавить приведенный выше код страницы Я хочу изменений.

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

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