VPF::Как завершить обтекание картинки?

Arien

Дата 15.7.2007, 01:38 (ссылка)

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

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 10
Регистрация: 13.3.2006

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

Ссылку на сайт дать не могу пока, извините. Могу дать кусок css-ника, если это поможет разобраться:

Код



div.content p a {
  border-bottom: 1px solid #3131c0;
}

div.content p a:hover{
  border-bottom: 1px solid #3131c0;
  color: #3131c0;
}

div.content{
  display: table;
  clear: both;
  height:1%;
}

div.node div.content .book-navigation {
  background: #eee;
  margin:0;
  padding:0;
  overflow:hidden;
}

div.node div.content .book-navigation ul.menu {
  border:0;
  border-top:1px solid #2763A5;
  margin:0;
  padding-bottom:10px;
}

div.node div.content .book-navigation .page-links{
  background: #C1D4EA;
  border:1px solid #2763A5;
  border-width:1px 0 1px 0;
  padding:5px;
  margin:0;
}

Тут, скорее всего, много лишнего smile

. Это немного модифицированный css-ник (точнее его часть) темы Bluebreeze для Drupal. Фрагмент html-кода, который использует этот css, был приведен выше в сокращенном варианте. Могу дать более полный вариант:

Код



<div class="content">
    <p><img WIDTH="200" HEIGHT="150" BORDER="0" ALIGN="left" SRC="/files/u1/vladstudio_skiing_1152x864_0.jpg" />Текст.</p>
  </div>

  
      <div class="links">
      <ul class="links inline"><li class="first last node_read_more"><a href="/articles/9" title="Читати далі." class="node_read_more">Read more</a></li>
</ul>    </div>
    
</div>
<div class="node" id="node-5">
      <h2 class="title">
      <a href="/articles/5">Идеологический политический процесс в современной России: политическое учение Руссо или социальная парадигма?</a>
    </h2>

  
    
  
    <div class="meta with-taxonomy">
  
          <div class="submitted">
      8 липня 2007      </div> 
        
     
      <div class="taxonomy"><ul class="links inline"><li class="first last taxonomy_term_1"><a href="/taxonomy/term/1" rel="tag" title="" class="taxonomy_term_1">Статті</a></li>
</ul></div>
        
  </div>
    
  <div class="content">
    <p><img src="/files/u1/IMG_0467.jpg" align="left" border="0" height="150" hspace="3" vspace="3" width="200" />Либеральная теория, несмотря на внешние воздействия, категорически обретает авторитаризм, что было отмечено П. Лазарсфельдом. Политическая культура символизирует механизм власти, утверждает руководитель аппарата Правительства.</p>

  </div>
  <!-- И так далее... Последний div обтекал картинку из первого -->

SelenIT

Дата 15.7.2007, 01:51 (ссылка)

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

Загрузка ...

баг форума

Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

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

Arien, так проблема в том, что <div class="links"> и последующие дивы обтекают картинку из предшествующего <div class="content">? Если так, то она решается с помощью

Код


div.links {
  clear: left;
}

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

Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!

WebDisaster

Дата 15.7.2007, 11:02 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 406
Регистрация: 22.6.2007

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

У меня складывается устойчивое ощущение, что задачу все понимают по-разному.

У меня, например, сложилось впечатление, что div1 должен быть слева, а div2 - справа от div1 (что бывает если div1, div2 {float: left} при фиксированной ширине div, как и показывал в своём примере топикстартер). А clear спасает положение только в том случае, если div2 выводится ниже div1.

Что ещё раз говорит о том, что бессмысленно что-то советовать, не видя макета.

Это сообщение отредактировал(а) WebDisaster - 15.7.2007, 11:11

SelenIT

Дата 15.7.2007, 11:10 (ссылка)

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

Загрузка ...

баг форума

Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

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

WebDisaster, осмелюсь заметить, что

последние три года тут решают немного не ту задачу, что у топикстартера;
ни в той, ни в другой задаче в упор не наблюдается div1, div2 {float: left} (!)

Что ещё раз говорит о том, что бессмысленно что-то советовать, не прочитав внимательно топик;)

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

Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!

WebDisaster

Дата 15.7.2007, 11:14 (ссылка)

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

Загрузка ...

Опытный

Профиль
Группа: Участник
Сообщений: 406
Регистрация: 22.6.2007

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

Цитата(SelenIT @ 15.7.2007, 11:10)

бессмысленно что-то советовать

ОК! Советовать больше не буду :(

SelenIT

Дата 15.7.2007, 11:22 (ссылка)

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

Загрузка ...

баг форума

Профиль
Группа: Завсегдатай
Сообщений: 3996
Регистрация: 17.10.2006
Где: Pale Blue Dot

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

WebDisaster, зачем же так радикально... Советуйте на здоровье - только будьте, плиз, впредь повнимательнее;)

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

Осторожно! Данный юзер и его посты содержат ДГМО! Противопоказано лицам с предрасположенностью к зонеризму!

Arien

Дата 15.7.2007, 11:48 (ссылка)

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

Загрузка ...

Новичок

Профиль
Группа: Участник
Сообщений: 10
Регистрация: 13.3.2006

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

Ребята, в том, что понимание проблемы у всех разное, моя вина smile

.

Картинка из самого первого дива должна обтекаться всеми дивами, кроме последнего (который, как и первый, <div class="content">). Проблема уже решена, хотя, возможно, и извращенным способом smile

.

Спасибо вам за участие ;).

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