X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость ( Вход | Регистрация )

2 страниц V   1 2 >
Открыть тему
Тема закрыта
> Div, обтекаемый текстом - как реализовать?
Skovhow
Skovhow
Topic Starter сообщение 8.9.2012, 12:19; Ответить: Skovhow
Сообщение #1


Бывалый
****

Группа: User
Сообщений: 435
Регистрация: 11.1.2010
Поблагодарили: 74 раза
Репутация:   21  


Есть шаблон с блочной вёрсткой. Всё, в принципе, отлично, но есть маленький недостаток в вёрстке: текст не хочет быть красивым.
Смотрите картинку:


--------------------
Активный доход - разработка сайтов. Пассивный доход - получаю тут
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Sickboy
Sickboy
сообщение 8.9.2012, 12:29; Ответить: Sickboy
Сообщение #2


Эффективное SEO
*****

Группа: Active User
Сообщений: 900
Регистрация: 18.11.2010
Из: Интернета
Поблагодарили: 624 раза
Репутация:   98  


В CSS для дива номер 2
text-align:justify;

Может это?


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Skovhow
Skovhow
Topic Starter сообщение 8.9.2012, 12:48; Ответить: Skovhow
Сообщение #3


Бывалый
****

Группа: User
Сообщений: 435
Регистрация: 11.1.2010
Поблагодарили: 74 раза
Репутация:   21  




--------------------
Активный доход - разработка сайтов. Пассивный доход - получаю тут
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Sickboy
Sickboy
сообщение 8.9.2012, 13:16; Ответить: Sickboy
Сообщение #4


Эффективное SEO
*****

Группа: Active User
Сообщений: 900
Регистрация: 18.11.2010
Из: Интернета
Поблагодарили: 624 раза
Репутация:   98  


А, так высоту диву номер 3 пропиши
height: 250px;
float:right;

ну че-нить такое. я немного не понимаю вопроса: "текст не хочет быть красивым"


--------------------
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Skovhow
Skovhow
Topic Starter сообщение 8.9.2012, 13:41; Ответить: Skovhow
Сообщение #5


Бывалый
****

Группа: User
Сообщений: 435
Регистрация: 11.1.2010
Поблагодарили: 74 раза
Репутация:   21  


(Sickboy @ 8.9.2012, 15:16) *
А, так высоту диву номер 3 пропиши
height: 250px;
float:right;

ну че-нить такое. я немного не понимаю вопроса: "текст не хочет быть красивым"


Так весь вопрос написан в заголовке smile.gif Не понимаю, что нужно сделать с div_2, чтобы он обтекал div_3... или, другими словами, как сделать так, чтобы текст обтекал div_3? Дело в том, что высота у div_3 непостоянная... ведь в div_3 может быть много текста, а может быть и мало...


--------------------
Активный доход - разработка сайтов. Пассивный доход - получаю тут
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Sickboy
Sickboy
сообщение 8.9.2012, 13:42; Ответить: Sickboy
Сообщение #6


Эффективное SEO
*****

Группа: Active User
Сообщений: 900
Регистрация: 18.11.2010
Из: Интернета
Поблагодарили: 624 раза
Репутация:   98  


Вставить див 3 в див 2 и прописать блоку
float:right;
width: ...px;


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


Поблагодарили: (2)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
lostprophet
lostprophet
сообщение 8.9.2012, 13:44; Ответить: lostprophet
Сообщение #7


Новый статус (1)
*******

Группа: Super Moderator
Сообщений: 2572
Регистрация: 18.11.2008
Из: Ростов-на-Дону
Поблагодарили: 3210 раз
Репутация:   293  


<div>
  <div style="width: 50px; height: 50px; float: right; display: inline-block;">
       Текст в обтекаемом диве
   </div>
Текст, текст, текст  в обтекающем диве
</div>
Примерно так.


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


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
wadya87
wadya87
сообщение 8.9.2012, 13:45; Ответить: wadya87
Сообщение #8


Частый гость
**

Группа: User
Сообщений: 59
Регистрация: 6.12.2011
Поблагодарили: 10 раз
Репутация:   2  


float:left;

Есть еще display:inline-block и vertical-align:top - обоим блокам прописать, вместе с шириной, будут рядом, но в ie8.0 - не работают


--------------------
Верстаю html, делаю калькуляторы (js, php)


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
satherland
satherland
сообщение 8.9.2012, 13:49; Ответить: satherland
Сообщение #9


Участник
***

Группа: User
Сообщений: 176
Регистрация: 9.2.2011
Поблагодарили: 51 раз
Репутация:   13  


Скорее всего, у левого "div" с текстом задана фиксированная ширина, которая удерживает текст в строго заданных размерах. Решение будет таким: должен быть общей контейнер-обертка, внутри которого будет "div" с "float: right" и заданной шириной - тот, в котором описываются данные фильма. После этого блока сразу выводим текст (вставляем "{full-story}"). Дальше в css нужно будет установить отступы, чтобы все красиво выглядело.

PS: lostprophet выше привел верный пример, только "display: inline-block" у правого дива не нужен.

Сообщение отредактировал satherland - 8.9.2012, 13:52


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


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
lostprophet
lostprophet
сообщение 8.9.2012, 13:54; Ответить: lostprophet
Сообщение #10


Новый статус (1)
*******

Группа: Super Moderator
Сообщений: 2572
Регистрация: 18.11.2008
Из: Ростов-на-Дону
Поблагодарили: 3210 раз
Репутация:   293  


satherland, верно, на всякий случай можно заменить на display: inline; для осла шестого при условии использования margin.


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


Поблагодарили: (1)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
2 страниц V   1 2 >
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Горячая тема (нет новых ответов) Как заработать новичку?
141 Emeralda 25559 Сегодня, 12:43
автор: Emtec
Открытая тема (нет новых ответов) Как организовать индексацию защищенных pdf с ключами и ссылками
И разместить pdf на внешних жирных ресурсах
0 kirch 399 Вчера, 23:37
автор: kirch
Открытая тема (нет новых ответов) [Книга] Налог на глупость: Как я заработал в интернете 5,5 млн рублей.
7 kotovsky 2125 Вчера, 8:30
автор: kolor73
Открытая тема (нет новых ответов) Король социалок 7: Генератор видео и 5 способов как на нём заработать
0 Volgar 411 19.5.2018, 17:09
автор: Volgar
Горячая тема (нет новых ответов) Тема имеет прикрепленные файлыКак носить смартфоны диагональю 5.5 - 6.4 дюйма?
41 Room 5087 19.5.2018, 15:28
автор: Chezarius


 



RSS Текстовая версия Сейчас: 21.5.2018, 21:02
Дизайн