Html Css多列、牢不可破的内容

我想有一个两栏的职位布局。它应该是平衡的，但如果其中一个稍大于另一个则是可以接受的。重要的是，这些岗位不应该一分为二

具体问题：（帖子文本应该放在一列中。）

有没有办法制作牢不可破的div、box等。？ 我在里面发现了列中断：避免列；但这并不起作用。如何正确使用这个

编辑： post包装器的结构如下所示。例如，内部的a列分隔符适用于段落，但我希望它适用于最外层的div

<div class="unbreakable-post">
<header class="opacity box">
<h2>...</h2>
</header>
<hr />
<div class="entry">
...
</div>
</div>

...

...

谢谢

Sziro

我在这方面取得了成功

.post {
  -webkit-column-break-inside: avoid;
  -moz-column-break-inside: avoid;
  column-break-inside: avoid;
}

试试看

.post {
  -webkit-column-break-inside: avoid;
  -moz-column-break-inside: avoid;
  column-break-inside: avoid;
}