body не растягивается!

@Hagrael · Регистрация: 07.01.2010

Студворк — интернет-сервис помощи студентам

Вот код:

HTML5
1
2
3
4
5
6
7
8
9
10
11
<body style="margin: 5px; background: #99FFCC;">
 
<div style="background: #99CC33; padding: 10px; height: 300px; width: 1400px;">
 
<div style="height: 250px; padding: 5px; background: #00CC00; border: 1px solid black; width: 1200px;">
Hello
</div>
 
</div>
 
</body>

Но margin'a нет

что делать? Я учу блочную вёрстку и думаю, что дело вот в чём. div'у родителю по барабану, какая ширина у его доч. дива, он всё равно растянется по род. блоку/ширине которую задали. И ведь body - это тоже блочный элемент, и может ему тоже по барабану, какой ширины его дочерний div. А background работает на всей странице, т. к. body - это всё-таки исключение. Но проблема вот в чём - не работает margin-right, что в прочем вполне естественно, если ширина body меньше чем ширина доч. блока, то левый, верхний, нижний margin делаются, а правый сделать body уже не может, т. к. не хватает ширины. Но у меня 2 вопроса:
1) Я учил так: body - это весь контент веб-страницы, но какой же это весь контент, если по ширине он меньше, чем этот же контент???
2) У какого элемента появляется scroll?
3) Как сделать margin-right при том, что div больше чем body?

Прошу ответить, т. к. мне ответ очень важен.

@Crudelis · 10.09.2010, 17:25

Сообщение от Hagrael

Но margin'a нет что делать?

какой именно мергин вы имеете ввиду? у меня есть мергин, между боди и первым дивом, все нормально

@Hagrael · 10.09.2010, 18:33 **[ТС]**

Crudelis, margin-right? Я имел в виду его. Да, я имею в виду первый div.

Vovan-VE · 10.09.2010, 18:45

Единственный margin, который я нашел в коде, у body.
margin - это внешний отступ. Куда body денет свой margin? О_о Дальше окна некуда.

@Hagrael · 10.09.2010, 18:55 **[ТС]**

Vovan-VE, т. е. у body макс. ширина - ширина окна? Насколько я знаю, в FireFox вообще body по контенту растягивается. В каких браузерах как фиксируется body, расскажите если не трудно. И ещё - у какого элемента появляется scroll? У <html>?
Спасибо за ответы.

Vovan-VE · 10.09.2010, 18:59

По умолчанию body занимает всю ширину окна, а по высоте сжимается по содержимому.
Прокрутка появляется у body.
Вообще, body весьма уникален.

@Hagrael · 10.09.2010, 19:10 **[ТС]**

Vovan-VE, но ведь прокрутка снизу, а не на элементе (не там, где заканчивается контент), или это исключение? Как я понял по контенту он и не расширяется, да? Ну это потому что у него display: block стоит. Хм, тогда всё логично. Спасибо! Да, точно display: block и даёт ему растяжку по горизонтали и сжатие по вертикали! Big Thanks, Vovan-VE!

Добавлено через 58 секунд
Но стоп. Как сделать отступ от края body? как не пытался, у меня не получается(

Vovan-VE · 10.09.2010, 19:19

Сообщение от Hagrael

Как сделать отступ от края body? как не пытался, у меня не получается(

Надо padding, а не margin.

@Hagrael · 10.09.2010, 19:34 **[ТС]**

Vovan-VE, но padding у body тоже не сработает... Вот этот код:

HTML5
1
2
3
4
5
<div style="padding:10px; width: 1210px;">
<div style="height: 250px; padding: 5px; background: #00CC00; border: 1px solid black; width: 1200px;">
Hello
</div>
</div>

работает. Но если убрать ширину у div'a родителя, то получается гадость. А допустим я не знаю его ширины, что делать тогда?

Vovan-VE · 10.09.2010, 19:37

Hagrael, Никак не могу понять, чего ты добиваешься? Что хочешь в итоге получить?

@Hagrael · 10.09.2010, 19:48 **[ТС]**

Я хочу понять, как не зная ширины доч. div'a задать ему margin в 10px, зная, что он больше чем ширина экрана. Прошу не думать, что это бредовый вымышленный вопрос.

Vovan-VE · 10.09.2010, 19:53

Либо margin у дочернего, либо padding у родителя, либо я твоей терминологии не понял

@Hagrael · 10.09.2010, 19:57 **[ТС]**

Vovan-VE, ну padding у body, как и у div'a созданного в body я задать не могу, если он будет в ширину как body, а следственно меньше чем внутренний div. С margin'ом уже пытался, не вышло( Цель - чтоб было справа пустое место, и условие - я не знаю ширину блока, а знаю лишь что он больше ширины body.

Vovan-VE · 10.09.2010, 20:00

Сообщение от Hagrael

Цель - чтоб было справа пустое место

А нарисовать два-три вложенных прямоугольника можешь?

@Hagrael · 11.09.2010, 13:04 **[ТС]**

Vovan-VE, в смысле?

Добавлено через 1 минуту
Проблема в том, что если создать ещё один div с padding'ом/margin'ом, то он растянется по ширине body! Может, стоит поэксперементировать с css-свойством display?

Vovan-VE · 11.09.2010, 13:56

Сообщение от Vovan-VE

А нарисовать два-три вложенных прямоугольника можешь?

Сообщение от Hagrael

в смысле?

Я понять не могу, чтО ты хочешь сделать, чтО хочешь получить? Нарисуй схематично 2-3 прямоугольника, чтобы происнить ситуацию.

@Hagrael · 11.09.2010, 14:20 **[ТС]**

Vovan-VE, ааа рисую =)

Добавлено через 10 минут

Вот ссылка на картинку. Как там видно, body ширина меньше, чем у div'a. И у этого div'a есть отступ. А ширины div'a я не знаю, поэтому вариант с род. блоком откатывает, т. к. у род. блока надо было бы тогда задать ширину. Заранее благодарен.

Vovan-VE · 11.09.2010, 14:34

Тогда надо внутри возиться, а не снаружи.

HTML5
1
2
3
4
5
6
7
<body style="margin:0; padding:0;">
  <div style="width:1500px; height:200px; padding:10px; background:#ccf;">
    <div style="background:#fcc;">
        test
    </div>
  </div>
</body>

@Hagrael · 11.09.2010, 14:44 **[ТС]**

Vovan-VE, выйдет, что контент будет внутри внутреннего div'a. А его ширину я не знаю. А раз не знаю, то не знаю, что ставить в width у род. div'a. А если внутренний div окажется 2000px? Тогда-то это не сработает.

Vovan-VE · 11.09.2010, 14:49

Hagrael, Теперь оба div'а нужны для контента. Считай, что здесь нет "родительского" div'а, который был раньше. Есть только "дочерний" (с еще одним дочерним внутри).

Новые блоги и статьи Все статьи Все блоги /
SDL3 для Web (WebAssembly): Реализация движения на Box2D v3 - трение и коллизии с повёрнутыми стенами 8Observer8 20.02.2026 Содержание блога Box2D позволяет легко создать главного героя, который не проходит сквозь стены и перемещается с заданным трением о препятствия, которые можно располагать под углом, как верхнее. . .	Конвертировать закладки radiotray-ng в m3u-плейлист damix 19.02.2026 Это можно сделать скриптом для PowerShell. Использование . \СonvertRadiotrayToM3U. ps1 <path_to_bookmarks. json> Рядом с файлом bookmarks. json появится файл bookmarks. m3u с результатом. # Check if. . .	Семь CDC на одном интерфейсе: 5 U[S]ARTов, 1 CAN и 1 SSI Eddy_Em 18.02.2026 Постепенно допиливаю свою "многоинтерфейсную плату". Выглядит вот так: https:/ / www. cyberforum. ru/ blog_attachment. php?attachmentid=11617&stc=1&d=1771445347 Основана на STM32F303RBT6. На борту пять. . .	Камера Toupcam IUA500KMA Eddy_Em 12.02.2026 Т. к. у всяких "хикроботов" слишком уж мелкий пиксель, для подсмотра в ESPriF они вообще плохо годятся: уже 14 величину можно рассмотреть еле-еле лишь на экспозициях под 3 секунды (а то и больше),. . .
И ясному Солнцу zbw 12.02.2026 И ясному Солнцу, и светлой Луне. В мире покоя нет и люди не могут жить в тишине. А жить им немного лет.	«Знание-Сила» zbw 12.02.2026 «Знание-Сила» «Время-Деньги» «Деньги -Пуля»	SDL3 для Web (WebAssembly): Подключение Box2D v3, физика и отрисовка коллайдеров 8Observer8 12.02.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами и вызывать обработчики событий столкновения. . . .	SDL3 для Web (WebAssembly): Загрузка PNG с прозрачным фоном с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 11.02.2026 Содержание блога Библиотека SDL3 содержит встроенные инструменты для базовой работы с изображениями - без использования библиотеки SDL3_image. Пошагово создадим проект для загрузки изображения. . .

@Hagrael БТР - мой друг 333 / 277 / 47 Регистрация: 07.01.2010 Сообщений: 1,932
	10.09.2010, 18:33 [ТС]
	Crudelis, margin-right? Я имел в виду его. Да, я имею в виду первый div. 1

Vovan-VE 13210 / 6599 / 1041 Регистрация: 10.01.2008 Сообщений: 15,069
	10.09.2010, 18:45
	Единственный margin, который я нашел в коде, у body. margin - это внешний отступ. Куда body денет свой margin? О_о Дальше окна некуда. 1

@Hagrael БТР - мой друг 333 / 277 / 47 Регистрация: 07.01.2010 Сообщений: 1,932
	10.09.2010, 18:55 [ТС]
	Vovan-VE, т. е. у body макс. ширина - ширина окна? Насколько я знаю, в FireFox вообще body по контенту растягивается. В каких браузерах как фиксируется body, расскажите если не трудно. И ещё - у какого элемента появляется scroll? У <html>? Спасибо за ответы. 0

Vovan-VE 13210 / 6599 / 1041 Регистрация: 10.01.2008 Сообщений: 15,069
	10.09.2010, 18:59
	По умолчанию body занимает всю ширину окна, а по высоте сжимается по содержимому. Прокрутка появляется у body. Вообще, body весьма уникален. 1

@Hagrael БТР - мой друг 333 / 277 / 47 Регистрация: 07.01.2010 Сообщений: 1,932
	10.09.2010, 19:10 [ТС]
	Vovan-VE, но ведь прокрутка снизу, а не на элементе (не там, где заканчивается контент), или это исключение? Как я понял по контенту он и не расширяется, да? Ну это потому что у него display: block стоит. Хм, тогда всё логично. Спасибо! Да, точно display: block и даёт ему растяжку по горизонтали и сжатие по вертикали! Big Thanks, Vovan-VE! Добавлено через 58 секунд Но стоп. Как сделать отступ от края body? как не пытался, у меня не получается( 0

Vovan-VE 13210 / 6599 / 1041 Регистрация: 10.01.2008 Сообщений: 15,069
	10.09.2010, 19:37
	Hagrael, Никак не могу понять, чего ты добиваешься? Что хочешь в итоге получить? 1

@Hagrael БТР - мой друг 333 / 277 / 47 Регистрация: 07.01.2010 Сообщений: 1,932
	10.09.2010, 19:48 [ТС]
	Я хочу понять, как не зная ширины доч. div'a задать ему margin в 10px, зная, что он больше чем ширина экрана. Прошу не думать, что это бредовый вымышленный вопрос. 0

Vovan-VE 13210 / 6599 / 1041 Регистрация: 10.01.2008 Сообщений: 15,069
	10.09.2010, 19:53
	Либо margin у дочернего, либо padding у родителя, либо я твоей терминологии не понял 1

@Hagrael БТР - мой друг 333 / 277 / 47 Регистрация: 07.01.2010 Сообщений: 1,932
	10.09.2010, 19:57 [ТС]
	Vovan-VE, ну padding у body, как и у div'a созданного в body я задать не могу, если он будет в ширину как body, а следственно меньше чем внутренний div. С margin'ом уже пытался, не вышло( Цель - чтоб было справа пустое место, и условие - я не знаю ширину блока, а знаю лишь что он больше ширины body. 0

@Hagrael БТР - мой друг 333 / 277 / 47 Регистрация: 07.01.2010 Сообщений: 1,932
	11.09.2010, 13:04 [ТС]
	Vovan-VE, в смысле? Добавлено через 1 минуту Проблема в том, что если создать ещё один div с padding'ом/margin'ом, то он растянется по ширине body! Может, стоит поэксперементировать с css-свойством display? 0

@Hagrael БТР - мой друг 333 / 277 / 47 Регистрация: 07.01.2010 Сообщений: 1,932
	11.09.2010, 14:20 [ТС]
	Vovan-VE, ааа рисую =) Добавлено через 10 минут Вот ссылка на картинку. Как там видно, body ширина меньше, чем у div'a. И у этого div'a есть отступ. А ширины div'a я не знаю, поэтому вариант с род. блоком откатывает, т. к. у род. блока надо было бы тогда задать ширину. Заранее благодарен. 0

@Hagrael БТР - мой друг 333 / 277 / 47 Регистрация: 07.01.2010 Сообщений: 1,932
	11.09.2010, 14:44 [ТС]
	Vovan-VE, выйдет, что контент будет внутри внутреннего div'a. А его ширину я не знаю. А раз не знаю, то не знаю, что ставить в width у род. div'a. А если внутренний div окажется 2000px? Тогда-то это не сработает. 0

Vovan-VE 13210 / 6599 / 1041 Регистрация: 10.01.2008 Сообщений: 15,069
	11.09.2010, 14:49
	Hagrael, Теперь оба div'а нужны для контента. Считай, что здесь нет "родительского" div'а, который был раньше. Есть только "дочерний" (с еще одним дочерним внутри). 0