Сдержите нижний колонтитул с динамическим контентом

Question

У меня есть динамическое содержимое в div, называемом txtresults, например:

<div id="txtresults"></div>

Этот div заполняется html после того, как запрос сделан с входным значением, пожалуйста, посмотрите на пример: JsFiddle

Если вы введете что-то, вы увидите, что div заполняется результатами поиска.Моя проблема в том, что я хочу расположить нижний колонтитул (#footer) под результатами независимо от того, насколько длинными или короткими они являются.Как вы можете видеть, нижний колонтитул расположен вне #txtresults.Если я поместу нижний колонтитул в div, я не смогу увидеть div .. Как я могу решить эту проблему?

Answer 1

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

Иначе, если вы хотите, чтобы нижний колонтитул находился чуть ниже результатов, удалите position: absolute (и bottom: 0) из footer.

Answer 2

Просто удалите абсолютную позицию из CSS, после чего нижний колонтитул будет сдавлен в соответствии с содержимым.

Answer 3

Если я правильно понял ваш вопрос, вы можете просто удалить следующее из #footer:

position: absolute;
bottom: 0px;

Вы также можете добавить margin-top: 20px в CSS нижнего колонтитула.