Warum schneidet Chrome den Text in meinem mehrspaltigen CSS3-Layout ab?

Question

Ich verwende ein mehrspaltiges CSS-Layout zur Anzeige von Text. Das Layout wird in Firefox korrekt angezeigt. Chrome hat jedoch einen Fehler, der schneidet den oberen und unteren Rand von Textzeichen ab . Warum ist das so? Wie kann ich es in Chrome zum Laufen bringen?

Hier ist ein Bildschirmfoto des Problems:

.multicolumn {
  max-width: 25em;
  columns: 3;
  margin: 0;
  font: 1.2em/.9 sans-serif;
}

.multicolumn p {
  margin: 0;
}

<div class="multicolumn">
  <p>hydrolytically hypabyssally hypogyny hyponymy mystifyingly karyotypically bathymetrically cloyingly</p>
</div>

Zum Schluss noch die Webseite, auf der ich versuche, das Ganze zum Laufen zu bringen: http://www.vcn.bc.ca/~dugan/css3/newhtml.html

Answer 1

In meinem Fall handelt es sich wohl eher um einen Fehler in Chrome, klar: beide wurde auf die Box gesetzt. Wenn man es zurücksetzt und box-sizing:border-box; angibt, ist das Problem für mich gelöst.