С нами с 07.06.08
Сообщения: 778
Рейтинг: 395
|
Добавлено: 30/05/13 в 16:22 |
Добрый день. Столкнулся с типичной проблемкой верстки, но нагуглить ответ сходу че-то не вышло, а потому к вам.
Работаю с WP, нужно разместить текст в коде как можно выше при этом визуально его оставить в футере (в нижней части блога). Как это попроще сделать? Как-то у меня пока все коряво выходит Заранее спасибо
PS. Текст уникален и будет только на индексе, так что в header его сувать мне не надо
|
|
|
|
С нами с 11.12.11
Сообщения: 351
Рейтинг: 737
|
Добавлено: 30/05/13 в 17:12 |
Текст ставишь где надо в коде, например в index.php, но при этом блок позиционируешь абсолютно и прицепляешь снизу, типа
.text {
position: absolute;
bottom: 5px;
}
а показать только на главной в WP это что-то типа
<?php if (is_home()) {
echo "<div class='text'>Example text</div>";
} ?>
как-то так .
|
|
|
|
С нами с 07.06.08
Сообщения: 778
Рейтинг: 395
|
Добавлено: 30/05/13 в 20:56 |
Спасибо) Вроде получилось. Правда пришлось ставить аж
position: absolute;
bottom: -1500px;
надо бы еще на кроссбраузерность затестить такой вариант
|
|
|
|
С нами с 07.06.08
Сообщения: 778
Рейтинг: 395
|
Добавлено: 26/06/13 в 00:00 |
Все-таки надо добить вопрос.
Предыдущее решение работает везде, но не на странице с видео. Из-за возможных комментариев, весь диз разъезжается и текст сползает вверх.
Вот урл voyeurtgp.net/Verstka/verstka.htm
Нужно, чтобы длинный текст всегда оказывался под всеми комментариями, а ссылка (она прописывается в футере) Смотреть онлайн © 2013 еще ниже этого текста. Как осуществить сию причуду))) Заранее большое спасибо
|
|
|
|
С нами с 09.03.09
Сообщения: 6053
Рейтинг: 3538
|
Добавлено: 26/06/13 в 20:41 |
|
|
|
|
С нами с 07.06.08
Сообщения: 778
Рейтинг: 395
|
Добавлено: 27/06/13 в 00:26 |
Ох нихрена ж себе)))
Я думал обойтись силами только CSS без задействования скриптов. Пойду разбираться
|
|
|
|
С нами с 07.06.08
Сообщения: 778
Рейтинг: 395
|
Добавлено: 27/06/13 в 01:25 |
не совсем понял куда этот код скрипта втыкать? Куда не приткну везде ошибка вылазит
|
|
|
|
С нами с 09.03.09
Сообщения: 6053
Рейтинг: 3538
|
Добавлено: 27/06/13 в 01:51 |
Код: | <DOCTYPE html>
<html>
<body>
<div id="wrapper">
<div id="text" style="position: absolute;top: 9999px">TEXT</div>
<div id="content">CONTENT</div>
<div id="footer">FOOTER</div>
</div>
<script src="http://code.jquery.com/jquery-2.0.0.min.js"></script>
<script>
$(document).ready(function() {
var f = function g(insert, after, before) {
return function() {
var i = $('#' + insert),
a = $('#' + after),
b = $('#' + before),
h = a.outerHeight(true);
i.css('top', a.position().top + h);
b.css('margin-top', i.outerHeight(true) + h - a.outerHeight());
};
},
g = f('text', 'content', 'footer');
g();
$(window).on('resize', g);
});
</script>
</body>
</html> |
|
|
|
|
С нами с 11.12.11
Сообщения: 351
Рейтинг: 737
|
Добавлено: 27/06/13 в 02:48 |
Обойтись только CSS можно легко, только надо же включить немного мозг
Я же тебе направление обозначил, чего нет мыслей совсем?
|
|
|
|
С нами с 07.06.08
Сообщения: 778
Рейтинг: 395
|
Добавлено: 27/06/13 в 22:37 |
Вроде сделал. Спасибо всем
|
|
|
|