Форум программистов
 

Восстановите пароль или Зарегистрируйтесь на форуме, о проблемах и с заказом рекламы пишите сюда - alarforum@yandex.ru, проверяйте папку спам!

Вернуться   Форум программистов > Web программирование > HTML и CSS
Регистрация

Восстановить пароль
Повторная активизация e-mail

Купить рекламу на форуме - 42 тыс руб за месяц

Ответ
 
Опции темы Поиск в этой теме
Старый 01.03.2011, 19:23   #1
Natysya
Пользователь
 
Регистрация: 24.11.2010
Сообщений: 30
Вопрос Обтекание картинки текстом

Здравствуйте, у меня почему-то картинка не обтекается текстом. Помогите решить проблему!
css:
Код:
body{
  margin: 0;
  padding: 0;
  height: 100%;
}
 
#conteiner{
  width: 980px;
  margin: 0 auto;
  background: #a1d8f0;
  height: 100%;
  border: 3px solid Black;
}
 
 
#header{
  background: url(pictures/header.jpg) no-repeat;
  height: 200px;
 
}
 
 
.left{
  margin-top: 10px;
  background: url(pictures/menu.jpg) repeat-y;
  margin-left: 8px;
  width: 230px;
  float: left;
  border: 2px solid White;
 
 
}
 
 
 
 
#center{
  margin: 10px 10px 10px 250px;
  border: 2px solid White;
  color: #002BD5;
  text-align: justify;
  text-indent: 3ex;
  padding: 3px;
 
}
 
.big{
  padding-left: 35%;
  font-size: 28px;
  font-family: fantasy;
 
}
 
 
#new{
  margin-top: 10px;
  margin-bottom: 10px;
  clear: both;
}
 
 
#footer{
  background: url(pictures/footer.jpg) no-repeat;
  height: 100px;
  clear: both;
  }
 
 
 
#menu ul{
  padding: 0;
  margin: 0;
  list-style-type: none;
}
 
#menu li{
  padding:10px 20px;
 
}
 
#menu ul li a{
  color: White;
  text-decoration: none;
  display: block;
 
}
 
#menu ul li a:hover{
  color: #0066FF;
  background: White;
}
.left p{
  color: White;
  text-align: justify;
  text-indent: 3ex;
  padding: 3px;
}
 .my_img{
 
   float: left;
   padding: 10px;
}
.stronG{
  font-weight: bold;
}
xhtml
Код HTML:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
 
<head>
  <title>Главная страница</title>
   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <meta name="keywords" content="цветы, комнатный цветы, букеты, розы,тюльпаны, ромашки, герберы" />
  <meta name="description" content="Описание всех видов цветов" />
  <link rel="stylesheet" type="text/css" href="style.css" />
</head>
 
<body>
  <div id="conteiner">
<div id="header"></div>
<div id="menu" class="left">
 <ul>
 <li><a href="index.html">Главная страница</a> </li>
 <li><a href="field.html">Полевые цветы</a> </li>
 <li><a href="spring.html">Весенние цветы</a> </li>
 <li><a href="room.html">Комнатые цветы</a> </li>
 <li><a href="medicament.html">Лекарственные растения</a> </li>
 <li><a href="meaning.html">Значения цветов</a> </li>
 </ul>
 </div>
 <div id="new" class="left">
<p class="stronG">Интересные факты...</p>
<p>До появления современных материалов в спасательных жилетах использовались стебли подсолнечника.</p>
<p>Хризантема изображена на оружии Японии и флагах.</p>
<p>Японцы также посвятили национальный фестиваль этому цветку (9-ого сентября). </p>
<p>Самая большая в мире орхидея может достигать 20 метров в длину.</p>
<p>Луковицы тюльпана могут использоваться вместо лука для приготовления.</p>
<p>Тюльпан – символ жизни, любви и бессмертия. Об этом цветке известно еще со времен Конфуция.</p>
<p>Принцу Чарльзу в качестве арендной платы за землю на его острове Сицилия выплачивают… один нарцисс в год! </p>
<p>В США, Европе и некоторых восточных странах считается, что чётное количество даримых цветов приносит счастье. </p>
</div>
 <div id="center">
 <img src="pictures/romashka.jpg" class="my_img" />
 <p>Ромашка - название растений из семейства Астровых (или Сложноцветных). Лекарственные свойства ромашки были известны еще врачам Древней
 Греции и Рима.Римский ученый Плиний Старший в своем фундаментальном труде «Естественная история» описал это растение
 под названием chamaemellon (chamai в переводе с греческого обозначает «низко», а mellon - «яблоко»), что характеризует размер
 астения и его характерный, похожий на яблочный, аромат.</p>
 <div id="footer"></div>
 </div>
</body>
 
</html>
интересно то, что картинка начинает обтекаться текстом на уробни блока new - интересный факты!
В чем может быть проблема?
Natysya вне форума Ответить с цитированием
Старый 02.03.2011, 09:37   #2
[MoNAMur]
читер
Форумчанин
 
Аватар для [MoNAMur]
 
Регистрация: 05.10.2009
Сообщений: 150
По умолчанию

в css
Код:
#center img { float:left; }
#center p { float:left; }
$me = $me == $me ? $me : $me;

Последний раз редактировалось [MoNAMur]; 02.03.2011 в 09:44.
[MoNAMur] вне форума Ответить с цитированием
Ответ


Купить рекламу на форуме - 42 тыс руб за месяц

Опции темы Поиск в этой теме
Поиск в этой теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
с текстом fenix163 Помощь студентам 1 01.03.2011 11:40
Отображение картинки на кнопке WPF. Загрузка картинки из ресурсов. Проблема с Uri. Casper-SC Общие вопросы .NET 0 27.06.2010 23:11
Обтекание в ИЕ: блочный обтекающий элемент не обтекает caprella HTML и CSS 7 27.05.2010 09:47
Позиционирование блоков и обтекание boget HTML и CSS 4 06.05.2010 14:18
Размер Image изменяется на размер картинки, а сама она рисуется на области первой картинки RPGer Мультимедиа в Delphi 6 20.10.2008 19:54