Какой смысл CSS, сворачивающего поля?
Модель поля CSS2 говорит нам, что смежные вертикальные поля выходят из строя.
Я нахожу это довольно раздражающим, будучи источником многих ошибок дизайна. Я надеюсь, что путем понимания цели свернуть поля, я пойму, когда использовать их и как избежать их, когда они не нужны.
Какова цель этой функции?
1 ответ
Общее значение «поля» не означает «переместить это на 10 пикселей», а скорее, «должно быть 10 пикселей пустого пространства рядом с этим элементом».
I ' Я всегда считал, что это легче всего осмыслить с помощью абзацев.
Если бы вы просто указали абзацы margin-top: 10px и не имели полей ни на каких других элементах, серия абзацев была бы красиво распределена. Но, конечно, вы столкнетесь с проблемами, если разместите другой элемент под абзацем. Эти двое коснутся.
Если бы поля не сжимались, вы не могли бы добавить margin-bottom: 10px в свой предыдущий код, потому что тогда любая пара абзацев будет разделена на 20 пикселей, а абзацы будут отделяться от других элементы всего на 10 пикселей.
Таким образом, вертикальные поля рушатся. Добавляя верхнее и нижнее поля в 10 пикселей, вы говорите: «Меня не волнует, какие правила полей имеют любые другие элементы. Я требую не менее 10 пикселей заполнения выше и ниже каждого из моих абзацев».