Застрял на проблеме CSS липкого нижнего колонтитула

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

http://blog.campquiet.com/stack/

В основном я хотел бы, чтобы фон с прозрачными боковыми панелями простирался до нижней части окна браузера. Нижний колонтитул (информация об авторских правах) также всегда должен быть внизу экрана, даже если контента недостаточно, чтобы продвинуть его так далеко).

Какие-либо предложения??

Обновление Возможно, я выразился не так ясно, как хотелось бы. В основном я пытаюсь выполнить то, что видно здесь: hxxp://www.cssstickyfooter.com/

Я не смог заставить это работать в моем шаблоне.


html css footer sticky-footer
person pstinnett    schedule 11.07.2010    source источник
comment
Вы имеете в виду такой фиксированный нижний колонтитул? stackoverflow.com/questions/673386/   -  person meder omuraliev    schedule 12.07.2010
comment
Не фиксированный нижний колонтитул - я не хочу, чтобы нижний колонтитул перекрывал содержимое. Я хочу, чтобы он был прикреплен к нижней части окна или опущен ниже, если содержимое заполняется.   -  person pstinnett    schedule 12.07.2010
comment
Это выглядит как дубликат stackoverflow.com/ вопросы/3224838/   -  person sorin    schedule 16.07.2010

Ответы (2)


arrow_upward
1
arrow_downward

Вам нужно установить тело и внешний контейнер на 100% высоты. Этот ответ может вам помочь: CSS 100% высоты с отступами/маржей

person Jordan    schedule 11.07.2010
comment
Я добавил высоту 100% в контейнер div. body и html уже были. Еще есть проблема! Я ходил туда и обратно между методами липкого нижнего колонтитула, поэтому, возможно, я удалил часть необходимого кода. - person pstinnett; 12.07.2010

arrow_upward
0
arrow_downward

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

#footer{
    position: fixed;
    bottom: 0; /* Keeps the footer glued to the bottom of the page */
    z-index: 9999; /* Keeps the footer on top of all other elements */
}

Для фона попробуйте применить CSS к тегу body?

body{
    background: url(assets/images/bg_clouds.jpg) fixed 0 0;
}

Вы можете применить дополнительные настройки для фона (например, положение и повтор), чтобы он выглядел так, как он есть на данный момент. В любом случае, если это не ответ на ваш вопрос, пожалуйста, помогите мне с более подробным объяснением вашего вопроса.

Надеюсь, это поможет.

ОБНОВЛЕНИЕ

Я поигрался с Firebug, чтобы отредактировать ваш CSS. Я думаю, если вы избавитесь от фонового css под html, body {} и добавите это в свой body {}

body {
   background: url("assets/images/bg_clouds.jpg") repeat-x fixed 0 0 #F0F4F7;
}

... он будет держать фон статичным, даже если вы прокручиваете. Он всегда будет там. Убедитесь, что у вас есть fixed вместо scroll

person Hristo    schedule 11.07.2010
comment
Я думаю, что мой вопрос, возможно, ввел вас в заблуждение. Пожалуйста, смотрите мое обновление для того, что я пытаюсь выполнить. Фон облаков правильный, я пытаюсь заставить нижний колонтитул работать правильно и расширить область содержимого, чтобы она соответствовала окну браузера, даже если нет содержимого, чтобы сдвинуть его вниз. - person pstinnett; 12.07.2010
comment
Ну... вы пробовали применить то, о чем говорится на сайте? Вы смотрели на CSS для липкого нижнего колонтитула? - person Hristo; 12.07.2010
comment
Да, я пытался внедрить липкий нижний колонтитул CSS, но он работал неправильно. Я думаю, что это связано с несколькими контейнерами div, но я не уверен. Я в тупике, как заставить это работать, поэтому я здесь :) - person pstinnett; 12.07.2010
comment
Я до сих пор не понимаю, в чем твоя проблема. Вы хотите, чтобы нижний колонтитул ВСЕГДА был внизу, независимо от того, много или мало контента и независимо от того, прокручиваете ли вы страницу? или вы хотите, чтобы нижний колонтитул был внизу только тогда, когда содержимого мало... например, если бы не было 3 столбцов заголовка? - person Hristo; 12.07.2010
comment
Извините за путаницу - второй случай - это то, что я ищу. Скажем, 3 элемента заголовка не было. Я все еще хочу, чтобы был белый фон и нижний колонтитул внизу окна. - person pstinnett; 12.07.2010
comment
OHH хорошо... это имеет смысл. Я поиграюсь с этим и отпишусь, если найду решение. Извините за непонимание вас. - person Hristo; 12.07.2010
comment
Не беспокойтесь :) Спасибо за вашу помощь. Я пытался заставить его работать весь день, и теперь я просто расстраиваюсь с каждой попыткой. Вот еще один пример работы: hxxp://boagworld.com/demos/FixedFooter/ - person pstinnett; 12.07.2010
comment
Я не смог понять, как это исправить... извините... это сложно без исходного кода. Я бы порекомендовал вам реструктурировать ваш код без каких-либо фоновых изображений, чтобы он работал так, как вы этого хотите... затем войдите и добавьте изображения и заставьте его работать с изображениями. Извините :/ - person Hristo; 12.07.2010