0

нужно чтобы div растягивался по высоте изображения. Забавы с position не помогают что-то

<div style="border:1px solid #000;">
<img src="http://hashcode.ru/upfiles/logo.png" align="right">
sometext
</div>

4 ответа 4

3
<div style="border:1px solid #000;">
<img src="http://hashcode.ru/upfiles/logo.png" align="right">
sometext
<div style="clear:both"></div>
</div>

Но тут осторожнее с clear:both : его еще надо правильно обработать, а то дизайн может поехать.

1
  • Вот спасибо.
    – ikoolik
    27 янв 2012 в 7:03
1

Это нормальное поведение, равносильно:

img{
    display: block;
    float: right;
}

Как вариант:

<div style="border:1px solid #000;">
    <div id="pic1"></div>
sometext
</div>

#pic1{
    background-image: url('http://hashcode.ru/upfiles/logo.png');
    background-repeat: no-repeat;
    background-position: right;
    height: 70px;
}
1
  • Я в курсе. Вопрос, как поэлегантней этого избежать.
    – ikoolik
    27 янв 2012 в 7:00
1

Для это требуется что бы и картинка и сам блок были, как бы это правильно сказать :), в одном потоке вот что у меня получилось:

<div style="border:1px solid #000;float:left;width:100%;">
        <img src="http://hashcode.ru/upfiles/logo.png" style="float:right;" align="right">
        sometext, sometext, sometext, sometext, sometext, sometext, sometext, sometext, sometext, sometext
    </div>
0

то есть ты хочешь сказать что тебе нужно чтоб верхушка текста совпадала с верхом картинки? если так то там все правильно посмотри на картинку http://hashcode.ru/upfiles/logo.png там вверху много белого места из-за этого высота больше, и выходит что верх текста и картинки совпадают

1
  • @Horus Перечитайте вопрос. А потом еще раз. Пример кода приведен в общем виде. Кстати, ответ уже получен и ответ принят.
    – ikoolik
    23 фев 2012 в 9:20

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.