Задать вопрос
@vgrayster
html

Как заставить div учитывать float у других элеиментов

Добрый день, нужно сделать следующее image

Как заставить DIV помеченный вопросиками учитывать, что слева есть картинка? если его просто вставить, то граница дива ничинается от края родительского DIV. а картинка просто его перекрывает. А мне нужно, чтобы граница дива была как нарисовано на картинке.

PS: почему-то картинка не видна, вот ее адрес habreffect.ru/ff4/b5e029e79
  • Вопрос задан
  • 3032 просмотра
1 комментарий
Подписаться 4 Оценить 1 комментарий
Пригласить эксперта
Ответы на вопрос 4
@vgrayster Автор вопроса
что-то похожее получилось сделать добавив к диву
float: left;
width: 400px;


но теперь проблема в том, что текст обтекает и проблемный див. а мне этого совершенно не нужно.
Ответ написан
Комментировать
Комментировать
@hom9k
Повесьте диву margin-left: <ширина картинки + отступ от картинки>
Ответ написан
2 комментария
2 комментария
@MSwind
.container {
margin-left: auto;
margin-right: auto;
width: 960px;
}

.for_image {
display: inline;
float: left;
margin-left: 10px;
margin-right: 10px;
width: 440px !important
}

.for_text {
display: inline;
float: left;
margin-left: 10px;
margin-right: 10px;
width: 40px !important
}


Как-то так… width для for_image установите тот который реально нужен будет…
Ответ написан
1 комментарий
1 комментарий
Delka
@Delka
задайте этому div {overflow: hidden}

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
  <title></title>
<style type="text/css">
/*<![CDATA[*/
div.block {}
div.block img {float: left;}
div.block div {overflow: hidden;}
/*]]>*/
</style>
</head>
<body>
  <div class="block">
    <img src="http://placekitten.com/200/300" alt="" />
    <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec posuere orci a dui egestas id lobortis nulla scelerisque. Mauris eu neque sed tellus vestibulum ornare. Vivamus malesuada venenatis lectus, sit amet feugiat quam pretium eget.</p>
    <div>Donec sollicitudin justo et justo commodo</div>
  </div>
  </body>
</html>
Ответ написан
Комментировать
Комментировать
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
Вакансии с Хабр Карьеры
Тестировщик-стажёр
ITooLabs • Тула
от 35 000 до 40 000 ₽
Fullstack PHP Developer
Smapse Education
от 40 000 до 65 000 ₽
Trainee - IT Support
move2usajobs.com LLC • Лос-Анджелес
от 2 000 до 4 000 $
Ещё вакансии
Заказы с Хабр Фриланса
Интеграция бс24 с сайтом на битрикс
02 мая 2024, в 03:39
7000 руб./за проект
HTML+Javascript траблшутинг
02 мая 2024, в 03:17
2000 руб./в час
Нужна презентация и опросник на новую фичу для ресторанов
02 мая 2024, в 01:05
8000 руб./за проект
Ещё заказы