Good ol’ Marge Instortende

0
35

Hier is een zin blog post over marge instortende: Wanneer twee block elementen zijn gestapeld op de top van elkaar, de verticale ruimte tussen hen is de grotere tussen de een op de top van de marge-bodem en één aan de onderkant van de marge-top.

Het is een beetje raar en ascii-shruggy. Paar kanttekeningen met hen, zoals je zou verwachten.

Ik vind het fascinerend hoe je het maakt voor de perfecte soort mini-blog post wanneer mensen een ah-ha moment over. MDN zelfs zijn oordeel hebben een speciale pagina.

Adam Roberts in 2015:

Hoewel de marge ineenstorting gedrag is in eerste instantie een beetje unintuitive, het maakt het leven gemakkelijker, in het geval van meerdere geneste elementen, waar het gedrag is vaak wenselijk.

Andrew Subsidie in 2015:

Het is waarschijnlijk niet de meest intuïtieve aspect van CSS, maar de camping hier is dat er enige logica in het spel en, als je eenmaal hebt geleerd, het mysterie en verwarring plotseling verdwijnt!

Geoff Graham in 2015:

Zie je hoe de instortende marges dingen kunt maken lastig? Ik persoonlijk deze tegenkomt op een frustrerend regelmatig bij het omgaan met typografie.

Magnus Benoni in 2016:

Marge instortende kan frustrerend zijn om te gaan met, maar weten hoe en wanneer het gebeurt, zal het gemakkelijker maken voor u om problemen op te lossen wanneer ze optreden.

Ire Aderinokun in 2017:

Opvouwbare marges kan vervelend zijn als je niet goed begrijpen wanneer ze zich voordoen. De eerste stap in het omgaan met of het vermijden van hen is [aan] precies in die geval van opvouwbare marges hebben we te maken met.

Adam Laki in 2018:

Marge ineenstorting is iets dat vermeld in elke CSS-book eerste of tweede hoofdstuk. Toen ik hoorde over de stylesheets in een lange tijd geleden, natuurlijk, ik had erover gelezen.

Jonathan Harrell in 2018:

Het concept van de marge instorten is fundamenteel voor een goed begrip van de box-model in CSS, maar het is eigenlijk heel complex en potentieel verwarrend. De spec beschrijven hoe marge ineenstorting werkt is een grondige, maar moeilijk te begrijpen.

Ik hoef het niet allemaal buiten om te zeggen dat het een over geblogd onderwerp (er is niets), maar dat het een interessante thread te volgen. Als zo veel mensen voelen de behoefte om iets uit te leggen uiteindelijk zo klein, er is iets vreemds (waarschijnlijk slecht) gebeurt er.

Geen twijfel, dit is de reden waarom het wordt beschouwd als een van de fouten in het ontwerp van de CSS:

De boven-en ondermarge van een doos mag nooit hebben kunnen instorten samen automatisch dit is de wortel van alle marge-fietsendrager kwaad.

De nadruk van hen, en is in feite alleen de vetgedrukte tekst in de hele lijst.

Als u op zoek bent om te stoppen met het gedrag, u zult iets moeten doen dat heeft waarschijnlijk meer bijwerkingen dan is het de moeite waard, zoals het drijven van de elementen. Het is niet zo eenvoudig als kick-off van een nieuw Blok Opmaak Context, als dat is wat display: flow-root; doet en dat werkt niet.

U bent waarschijnlijk beter af als alleen de kennis over en het omgaan met het zoals het komt door het systematisch stroomt marges in één richting, of steeds raar.