Как разместить img в правом нижнем углу div
alt text http://img190.imageshack.us/img190/7514/unbenanntax.jpg
Это то, что я хочу сделать. Div с текстом в нем и в правом нижнем углу img. Высота div стабильна при 24px, но длина неизвестна и может быть более одного из этих divs В строке.
Ответы
Ответ 1
Есть несколько способов сделать это. Самый простой:
<div class="outer">
<img src="....">
</div>
с
div.outer { position: relative; height: 24px; }
div.outer img { position: absolute; right: 0; bottom: 0; }
Теперь, когда он вынимается из обычного потока, что является проблемой, вы хотите, чтобы другой контент обертывал/плавал вокруг него. В этом случае вам действительно нужно знать высоту изображения, а затем применять соответствующие трюки в зависимости от того, что у вас есть.
Начните с Создание абсолютного, относительного.
Если изображение имеет высоту 10 пикселей, например, вы можете попробовать следующее:
div.outer { height: 24px; }
div.outer { float: right; margin-top: 14px; }
Конечно, 14px происходит от 24px - 10px. Я не знаю, удовлетворит ли это то, что вы пытаетесь достичь.
Ответ 2
Фоновое изображение - ваше решение.
<div class="blarg" style="background:url(image.gif) bottom right no-repeat">Content</div>
Вам может потребоваться настроить прокладки div, так что содержимое div не будет перекрывать ваше изображение, если это необходимо.
Ответ 3
Если вы хотите плавать текст вокруг изображения, оба этих ответа неверны. Оба текста сделают текст прямо над изображением. Я искал часы и никакого реального ответа не существует. В этой статье более четко объясняется, почему оба ответа не будут работать, если вы пытаетесь обернуть текст.