Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > Позиционирование div внизуй td неизвестной высоты

Автор: olegarh 16.10.2011, 23:46

Здравствуйте.

Есть сайт с табличной версткой

http://rektema.ru/
Разметку можете посмотреть там

Нужно расположить картинку в самом низу td слева (там же где и меню, только в самом низу)
высота td динамическая.

Перепробовал много способов из сети, но они все не подходят

Код примерно такой

Код


<td>
<table>......</table>
<!--Здесь под этой таблицей остается пустое место и в самом его низу и нужно разместить картинку-->
</td>

Заранее спасибо

Автор: magelan 17.10.2011, 00:41

Попробуйте что нить типа:

Код


<td style="position: relative">
<table>...</table>
<div style="position: absolute; bottom: 0; left: 0">
<img src...>
</div>
</td>

Автор: $дмитрий 17.10.2011, 01:02

Если картинка по высоте небольшая, самый простой вариант будет вставить там где

Код


<td class="tdb2">

Сделать абсолютное позиционирование и сместить вверх

Код


<img src="photo.jpg" style="position:absolute; margin:-100px 0 0 0">

Автор: magelan 17.10.2011, 09:41

костыль предлагаете, чтобы человек потом искал откуда у него 100 пикселей скролла вылезло? smile

P.$. Если не выйдет по человечески засунуть, можно бэкграундом (не выведется на печать у большинства пользователей)

Код


<td style="background: Black url('картинко') no-repeat bottom left;">

Автор: $дмитрий 17.10.2011, 15:25

Цитата

откуда у него 100 пикселей скролла вылезло

А причем здесь скрол? Картинка просто наверх сместится smile

Автор: SelenIT 17.10.2011, 20:32

Цитата(magelan @ 17.10.2011, 00:41

)

К сожалению, не работает в актуальных FF.

Имхо, вариант $дмитрия вполне неплох и логичен (от чего пляшем — к тому и привязываемся). Только, если уж ставим абсолютное позиционирование, то и сдвигать логичнее/надежнее не отступами, а координатами (напр. bottom: 0), обернув предварительно div-ом c position:relative. Тогда уж точно и скроллы ниоткуда не повылезут smile

Автор: olegarh 18.10.2011, 15:31

Цитата(magelan @ 17.10.2011, 00:41)

Попробуйте что нить типа:

Код


<td style="position: relative">
<table>...</table>
<div style="position: absolute; bottom: 0; left: 0">
<img src...>
</div>
</td>

Спасибо

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

http://www.rektema.ru/index.php?newsid=83

это из-за position: absolute;
была мысль сделать что то вроде min-height для td, но он не подходит
как еще можно решить?

Автор: SelenIT 18.10.2011, 16:39

Нижний padding левой ячейке задать, на высоту картинки, например.