ReSQL.ru
     
powered by simpleCommunicator - 2.0.61     © 2026 Programmizd 02
Мобильная версия    Контакт    Правила    FAQ    Помощь
Целевая тема:
Создать новую тему:
Автор:
Закрыть
Цитировать
Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Неплавающий блок не обтекает плавающий блок
10 сообщений из 10, страница 1 из 1
Неплавающий блок не обтекает плавающий блок
    #38688836
Cyrax_02
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Cyrax_02
Участник
Почему в нижеприведённом примере неплавающий блок block1 НЕ обтекает плавающий блок block2 , тогда как плавающие подблоки item в составе block1 обтекают block2 ?
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
<!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">
<head>  
<style>

.right { float:right; }
.left { float:left; }
.newline { clear: both; }

.block1 {
    width: auto;
    background: red;
    padding: 5px;
}
.block2 {    
    width: 300px;    
    background: yellow;
    padding: 5px;
}
.item         { background: grey; }
.block1 .item { width: 33% }
.block2 .item { width: 50% }

</style>
</head>

<body>

<div class="block2 right">
    <div class="item left"><span>Item</span></div>
    <div class="item left"><span>Item</span></div>
    <div class="newline"></div>
</div>

<div class="block1">
    <div class="item left"><span>Item</span></div>
    <div class="item left"><span>Item</span></div>
    <div class="item left"><span>Item</span></div>
    <div class="newline"></div>
</div>

</body>
</html>
...
Рейтинг: 0 / 0
06.07.2014, 13:21
| Ответить | Цитировать | Написать  
Неплавающий блок не обтекает плавающий блок
    #38688838
Cyrax_02
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Cyrax_02
Участник
Применительно к картинке:
Почему красный блок НЕ обтекает жёлтый блок, тогда как подблоки в красном блоке обтекают желтый блок ?
...
Рейтинг: 0 / 0
06.07.2014, 13:24
| Ответить | Цитировать | Написать  
Неплавающий блок не обтекает плавающий блок
    #38688848
Cyrax_02
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Cyrax_02
Участник
Впрочем, почему красный блок занимает всю доступную ширину (если не указывать конкретной ширины) в потоке, понятно - это свойство всех неплавающих блоков (жёлтый блок выводится из потока => красный блок его не "видит"). Т.е. вопрос стоит перефразировать:
Как сделать так, чтобы красный блок обтекал жёлтый ?

Конкретную (или процентную) ширину красному блоку задавать нельзя, т.к он должен быть резиновым (расширяться до жёлтого блока).
...
Рейтинг: 0 / 0
06.07.2014, 14:25
| Ответить | Цитировать | Написать  
Неплавающий блок не обтекает плавающий блок
    #38688849
Cyrax_02
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Cyrax_02
Участник
Красному блоку задавать margin-right, равный ширине жёлтого блока, нельзя. Т.к. в этом случае ширина жёлтого блока будет фигурировать в CSS в 2 местах.
...
Рейтинг: 0 / 0
06.07.2014, 14:38
| Ответить | Цитировать | Написать  
Неплавающий блок не обтекает плавающий блок
    #38688932
Cyrax_02
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Cyrax_02
Участник
Похоже, это возможно только табличной вёрсткой...
...
Рейтинг: 0 / 0
06.07.2014, 19:46
| Ответить | Цитировать | Написать  
Неплавающий блок не обтекает плавающий блок
    #38689411
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
Cyrax_02 Почему красный блок НЕ обтекает жёлтый блок, тогда как подблоки в красном блоке обтекают желтый блок ?
Начнем с того, чтоЖ
- "не плавающий" блок никого и не обтекает по определению
- спаны не есть блоки
...
Рейтинг: 0 / 0
07.07.2014, 13:55
| Ответить | Цитировать | Написать  
Неплавающий блок не обтекает плавающий блок
    #38689415
Фотография krvsa
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
krvsa
Участник
krvsa- спаны не есть блоки
Тут уже я просмотрел...

Дык плавающие блоки и должны плавать, обтекая друг друга, так же по определению.

Т.ч. по примеру никакого криминала.
...
Рейтинг: 0 / 0
07.07.2014, 13:57
| Ответить | Цитировать | Написать  
Неплавающий блок не обтекает плавающий блок
    #38689433
Cyrax_02
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Cyrax_02
Участник
Так вот это обойти нельзя при использовании блочной вёрстки:
авторКрасному блоку задавать margin-right, равный ширине жёлтого блока, нельзя. Т.к. в этом случае ширина жёлтого блока будет фигурировать в CSS в 2 местах .
Т.е. можно сделать так, чтобы ширина жёлтого блока фигурировала в CSS только в одном месте ?
...
Рейтинг: 0 / 0
07.07.2014, 14:09
| Ответить | Цитировать | Написать  
Неплавающий блок не обтекает плавающий блок
    #38689571
Фотография skyANA
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
skyANA
Участник
Cyrax_02Т.е. можно сделать так, чтобы ширина жёлтого блока фигурировала в CSS только в одном месте ?LESS?
...
Рейтинг: 0 / 0
07.07.2014, 15:58
| Ответить | Цитировать | Написать  
Неплавающий блок не обтекает плавающий блок
    #38689636
Cyrax_02
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Cyrax_02
Участник
Без препроцессоров чисто средствами css никак нельзя ?
...
Рейтинг: 0 / 0
07.07.2014, 17:11
| Ответить | Цитировать | Написать  
10 сообщений из 10, страница 1 из 1
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Неплавающий блок не обтекает плавающий блок
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение   Полит. конфиден.  
NoSQL.ru       Кролег: Проекты, Новости, Чат       РЕД ФОРУМ       Фотоальбом: Участники, Встречи
Закрыть
start [/forum/topic.php?fid=22&msg=38689433&tid=1446925]:
 0ms
get settings:
 7ms
get forum list:
 17ms
check forum access:
 3ms
check topic access:
 3ms
track hit:
 169ms
get topic data:
 9ms
get forum data:
 2ms
get page messages:
 49ms
get tp. blocked users:
 1ms
others: 204ms
total:  464ms
созд. / загр.: 464ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]