VPF::сверстать блоками в виде таблицы с двумя столбцами

dipsy

Дата 9.8.2010, 10:51 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 283
Регистрация: 13.1.2005
Где: Нижний Новгород

Репутация: нет
Всего: нет

Надо реализовать примерно это, но только на div-ах:

Код


<table width="100%" border="1">
<tr>
   <td width="1%" valign="top"><img src="1.jpg"></td>
   <td valign="top">
   какой-то там текст<br>
   какой-то там текст<br>
   какой-то там текст<br>
   какой-то там текст<br>
   какой-то там текст<br>
   </td>
</tr>
</table>

Фишка в том, что изображение может быть или не быть, и ширина изображения заранее неизвестна.
Почему надо на дивах - потому что код так генериться, есть блоки и доступ к css. Конечно, можно поднапрячься и изменить код, вставить туда таблицы. Но очень интересно, можно ли решить через css.

dipsy

Дата 9.8.2010, 11:39 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 283
Регистрация: 13.1.2005
Где: Нижний Новгород

Репутация: нет
Всего: нет

Решение найдено:

Код


<style>
.item {
  width:100%;
  border: 1px solid red;
  overflow:hidden;
}
.item .icon {
  float: left;
  margin-right:5px;
}
.item .text {
  overflow-x:auto;
  overflow-y:visible;
  border: 4px solid green;
  background: gray;
  _height: 1%; /* хак для ie6, связано со свойством hasLayout */
} 
</style>
<div class="item">
<div class="icon"><img src="1.jpg"></div>
<div class="text">
    text text text
    <br>text text text
    <br>text text text
    <br>text text text
    <br>text text text
    <br>text text text
    <br>text text text
    <br>text text text
    <br>text text text
</div>
</div>

ksnk

Дата 9.8.2010, 14:26 (ссылка)

(нет голосов)

Загрузка ...

прохожий

Профиль
Группа: Комодератор
Сообщений: 6855
Регистрация: 13.4.2007
Где: СПб

Репутация: 48
Всего: 386

dipsy, А то, что длинный текст будет снизу картинку облегать - ничего?

--------------------

Человеку свойственно ошибаться, программисту свойственно ошибаться профессионально ! user posted image

dipsy

Дата 3.9.2010, 15:36 (ссылка)

(нет голосов)

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 283
Регистрация: 13.1.2005
Где: Нижний Новгород

Репутация: нет
Всего: нет

Ничего, т.к. облегать не будет. Код же выложил, смотрим, наслаждаемся...

0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема \| Вёрстка веб-сайтов \| Следующая тема »