Добър ден, скъпи читатели!

Разбирането на начина, по който срива (колапс) марж-те години в CSS. може да направи живота на уеб-разработчиците много по-лесно. Нека да видим как разпадането на марж-ите в CSS.

Хоризонтално и вертикално Марж Collapsing

Хоризонтална марж-а никога не се срине. Но с вертикалата, че не е толкова просто.

За да разберете как вертикалната марж-ите колапс, нека създадем един прост пример.

Резултатът в браузъра

Положителен вдлъбнатина между съседните елементи

Непосредствено вертикална марж-те колапс. Ако два елемента имат положително вертикално уплътнение, резултатът е разчленена между елементите ще бъде най-голямото от две тирета.

Резултатът в браузъра

Взаимното свързване на елементи с положителни и отрицателни граници

Ако един елемент има положителен вдлъбнатина, а вторият е отрицателен, резултатът ще бъде количеството на уплътнение между елементите.

Резултатът в браузъра

Ако размерът на отстъп е отрицателен, последния елемент да се припокрива първия. Нека тази от примера по-долу.

Резултатът в браузъра

Крахът на вдлъбнатината на майка и дете елемент

Ако майка елемент е без граница или пълнеж. След това майка и дете тире да се срине и резултатът е по-голямата от две тирета.

Резултатът в браузъра

Как да премахнете марж срутване родител и дете елемент

За да премахнете колапс, е необходимо да се поиска родител или граничен уплътнение елемент.

Резултатът в браузъра