Warning: Cannot use a scalar value as an array in /home/admin/public_html/forum/include/fm.class.php on line 757

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/include/fm.class.php on line 770

Warning: Invalid argument supplied for foreach() in /home/admin/public_html/forum/topic.php on line 737
Форумы портала PHP.SU :: margin/padding

 PHP.SU

 Программирование на PHP, MySQL и другие веб-технологии
PHP.SU Портал     На главную страницу форума Главная     Помощь Помощь     Поиск Поиск     Поиск Яндекс Поиск Яндекс     Вакансии  Пользователи Пользователи


 Страниц (2): [1] 2 »   

> Описание: margin/padding
Поиск в теме | Версия для печати
Junes
Отправлено: 11 Августа, 2013 - 09:36:26
Post Id


Новичок


Покинул форум
Сообщений всего: 44
Дата рег-ции: Апр. 2011  


Помог: 0 раз(а)
скажите, почему родитель с min-hight 100% не учитывает margin-bottom у детей? как решить проблему?

CODE (html):
скопировать код в буфер обмена
  1. html, body height:100%; }
  2. *{ margin: 0; padding: 0;}
  3. #parent{
  4.     background: #aaa;
  5.     min-height:100%;
  6. }
  7. #child{
  8.     margin-bottom: 2000px;
  9.     background: pink;
  10. }


PHP:
скопировать код в буфер обмена
  1. <div id="parent">
  2.     <div id="child">hello</div>
  3. </div>

(Отредактировано автором: 11 Августа, 2013 - 10:22:13)

 
 Top
armancho7777777 Супермодератор
Отправлено: 11 Августа, 2013 - 10:35:26
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
А какого Вы ждёте поведения от приведённой разметки и стилей ?
 
 Top
Junes
Отправлено: 11 Августа, 2013 - 10:48:03
Post Id


Новичок


Покинул форум
Сообщений всего: 44
Дата рег-ции: Апр. 2011  


Помог: 0 раз(а)
armancho7777777 пишет:
А какого Вы ждёте поведения от приведённой разметки и стилей ?


я жду что блок с классом #parent растянется в низ на 2000px и появится полоса прокрутки, разве нет?

(Отредактировано автором: 11 Августа, 2013 - 10:48:23)

 
 Top
armancho7777777 Супермодератор
Отправлено: 11 Августа, 2013 - 11:07:24
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
Нет.
Там нет ни каких ограничителей, чтобы это произошло.
У элемента #parent должна быть или нижняя граница, или внутренний отступ, хотя бы в 1px снизу.
Или перед элементом #child должен быть какой-либо элемент.

Junes пишет:
CODE (css):
скопировать код в буфер обмена
  1. *{ margin: 0; padding: 0;}

И не надо так делать.
 
 Top
Саныч
Отправлено: 11 Августа, 2013 - 12:03:09
Post Id



Участник


Покинул форум
Сообщений всего: 1365
Дата рег-ции: Июль 2010  
Откуда: Украина, Запорожье


Помог: 62 раз(а)
Junes
CODE (css):
скопировать код в буфер обмена
  1. *{ margin: 0; padding: 0;}
  2. #parent{
  3.     background: #aaa;
  4.     min-height:100%;
  5. }
  6.  
  7. #child{
  8.     padding-bottom: 2000px;
  9.     background: pink;
  10. }


armancho7777777 пишет:
И не надо так делать.
Почему? А как же сброс стилей?


-----
Все возражают против того, что я гений, хотя никто еще так меня не назвал. - Орсон Уэллс
 
 Top
armancho7777777 Супермодератор
Отправлено: 11 Августа, 2013 - 12:19:27
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
Саныч пишет:
А как же сброс стилей?

Не приветствую. И не только я.
Зачем сбрасывать отступы всем элементам поголовно
(то есть параграфам, всем заголовкам, спискам всех типов, таблицам и их ячейкам, элементам формы и т.д.),
чтобы затем всем им в обязательном порядке установить отступы ?
Грязная работа и головная боль на будущее.
Про различные визуальные редакторы прикрученные к сайту для редактирования контента я уже молчу.
Задайте нужные отступы тем элементам, для которых требуется это сделать через класс.
Не более.
 
 Top
Junes
Отправлено: 11 Августа, 2013 - 12:44:14
Post Id


Новичок


Покинул форум
Сообщений всего: 44
Дата рег-ции: Апр. 2011  


Помог: 0 раз(а)
armancho7777777 пишет:
Нет.
Там нет ни каких ограничителей, чтобы это произошло.
У элемента #parent должна быть или нижняя граница, или внутренний отступ, хотя бы в 1px снизу.
Или перед элементом #child должен быть какой-либо элемент.

Junes пишет:
CODE (css):
скопировать код в буфер обмена
  1. *{ margin: 0; padding: 0;}

И не надо так делать.


спасибо, сделал через overflow: hidden;
 
 Top
armancho7777777 Супермодератор
Отправлено: 11 Августа, 2013 - 12:47:22
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
Junes пишет:
сделал через overflow: hidden;

Гм... Что - то связи никакой не улавливаю )
Ну да ладно... )
 
 Top
Саныч
Отправлено: 11 Августа, 2013 - 12:53:20
Post Id



Участник


Покинул форум
Сообщений всего: 1365
Дата рег-ции: Июль 2010  
Откуда: Украина, Запорожье


Помог: 62 раз(а)
armancho7777777 пишет:
Зачем сбрасывать отступы всем элементам поголовно
(то есть параграфам, всем заголовкам, спискам всех типов, таблицам и их ячейкам, элементам формы и т.д.),
чтобы затем всем им в обязательном порядке установить отступы ?
Затем, чтобы те, кому отступы мы потом не установили, во всех браузерах отрисовывались одинаково, а именно 0, а не как попало.


-----
Все возражают против того, что я гений, хотя никто еще так меня не назвал. - Орсон Уэллс
 
 Top
armancho7777777 Супермодератор
Отправлено: 11 Августа, 2013 - 12:54:58
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
Саныч, да делайте как считаете нужным Улыбка

Саныч пишет:
чтобы те, кому отступы мы потом не установили, во всех браузерах отрисовывались одинаково, а именно 0, а не как попало.

Тобишь это ...
CODE (css):
скопировать код в буфер обмена
  1.  
  2. h1, h2, h3, h4, h5, h6, ul, ol, li, table, td, p, div { margin: 0; padding:0; }
  3.  

... Вы считаете наилучшим решением? Улыбка
Повторяю, для этого есть классы ?
Трогать на прямую даже просто теги - плохой тон.

Прикрутили какой-нибудь гаджет/виджет,
у которого свои стили заданы через классы,
а они ни действуют, так как приоритетом ниже ))
Примеров можно привести уйму )

И уже не говорю о том, что у каждого из перечисленных выше тегов,
за исключением таблиц и дивов,
должны быть разные внешние отступы.
 
 Top
DelphinPRO
Отправлено: 11 Августа, 2013 - 13:24:10
Post Id



Активный участник


Покинул форум
Сообщений всего: 7187
Дата рег-ции: Февр. 2012  


Помог: 353 раз(а)
armancho7777777 пишет:
Трогать на прямую даже просто теги - плохой тон.

да бросьте, не перегибайте палку Улыбка
лучше написать так
CODE (text):
скопировать код в буфер обмена
  1. <ul class="nav">
  2.   <li>...</li>
  3.   <li>...</li>
  4. </ul>
  5. .nav li { стили }

чем так
CODE (text):
скопировать код в буфер обмена
  1. <ul class="nav">
  2.   <li class="nav_item">...</li>
  3.   <li class="nav_item">...</li>
  4. </ul>
  5. .nav_item { стили }


и к тегам разумно применять стили и использовать каскады. Просто применять нужно с умом.

извиняюсь за оффтопик.
(Добавление)
armancho7777777 пишет:
Прикрутили какой-нибудь гаджет/виджет,
у которого свои стили заданы через классы,
а они ни действуют, так как приоритетом ниже ))
Примеров можно привести уйму )

у классов приоритет выше, чем у тегов, если что.. Улыбка


-----
Чем больше узнаю, тем больше я не знаю.
 
 Top
armancho7777777 Супермодератор
Отправлено: 11 Августа, 2013 - 13:26:19
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
DelphinPRO пишет:
да бросьте, не перегибайте палку
лучше написать так

Читаем внимательно, и смотрим пример.
armancho7777777 пишет:
CODE (css):
скопировать код в буфер обмена
  1. h1, h2, h3, h4, h5, h6, ul, ol, li, table, td, p, div { margin: 0; padding:0; }

Разницу улавливаете ?

DelphinPRO пишет:
у классов приоритет выше, чем у тегов, если что..

Речь шла о универсальном селекторе, если что.... Подмигивание
 
 Top
Саныч
Отправлено: 11 Августа, 2013 - 13:33:43
Post Id



Участник


Покинул форум
Сообщений всего: 1365
Дата рег-ции: Июль 2010  
Откуда: Украина, Запорожье


Помог: 62 раз(а)
Ну и где вы увидели перечисление тегов? Речь шла про универсальный селектор и нулевые отступы.
Да и похоже вы в приоритетах не очень, советую повторить. С каких это пор селекторы классов стали ниже приоритетом, чем тегов, а тем более универсальный. Как бы все наоборот Улыбка

armancho7777777 пишет:
Трогать на прямую даже просто теги - плохой тон.
Впервые слышу.

Мое стандартное начало CSS:
CODE (css):
скопировать код в буфер обмена
  1. * {
  2.     padding: 0;
  3.     margin: 0;
  4.     border: 0;
  5. }
  6. body {
  7.     background: /* основной фон страницы, обычно #fff */;
  8.     font: /* основной стиль/размер текста */;
  9.     color: /* осоновной цвет текста, обычно #000*/;
  10. }


-----
Все возражают против того, что я гений, хотя никто еще так меня не назвал. - Орсон Уэллс
 
 Top
DelphinPRO
Отправлено: 11 Августа, 2013 - 13:36:18
Post Id



Активный участник


Покинул форум
Сообщений всего: 7187
Дата рег-ции: Февр. 2012  


Помог: 353 раз(а)
armancho7777777 пишет:
Разницу улавливаете ?

честно говоря, нет. чем плоха такая запись?
h1, h2, h3, h4, h5, h6, ul, ol, li, table, td, p, div { margin: 0; padding:0; }
(кроме мусора в инспекторе кода)


-----
Чем больше узнаю, тем больше я не знаю.
 
 Top
armancho7777777 Супермодератор
Отправлено: 11 Августа, 2013 - 13:36:57
Post Id



Активный участник


Покинул форум
Сообщений всего: 4526
Дата рег-ции: Февр. 2011  
Откуда: Москва


Помог: 221 раз(а)
И и к тому же, даже про это
DelphinPRO пишет:
лучше написать так
CODE (css):
скопировать код в буфер обмена
  1. .nav li { стили }

... у тегов LI могут быть вложенные списки (многоуровневое меню) у которых свои стили,
и в Вашем случае придётся переопределить унаследованные стили
CODE (css):
скопировать код в буфер обмена
  1. .nav li LI { стили }

Лично я использую именно этот Вариант в случае с многоуровневым меню:
DelphinPRO пишет:
CODE (css):
скопировать код в буфер обмена
  1. .nav_item { стили }

Только название более содержательное.
(Добавление)
DelphinPRO пишет:
честно говоря, нет. чем плоха такая запись?

Читаем выше.
(Добавление)
armancho7777777 пишет:
И уже не говорю о том, что у каждого из перечисленных выше тегов,
за исключением таблиц и дивов,
должны быть разные внешние отступы.

armancho7777777 пишет:
Про различные визуальные редакторы прикрученные к сайту для редактирования контента я уже молчу.
 
 Top
Поиск в теме | Версия для печати
Страниц (2): [1] 2 »
Сейчас эту тему просматривают: 0 (гостей: 0, зарегистрированных: 0)
« HTML, Дизайн & CSS »


Все гости форума могут просматривать этот раздел.
Только зарегистрированные пользователи могут создавать новые темы в этом разделе.
Только зарегистрированные пользователи могут отвечать на сообщения в этом разделе.
  



Powered by PHP  Powered By MySQL  Powered by Nginx  Valid CSS  RSS

 
Powered by ExBB FM 1.0 RC1. InvisionExBB