php - 50% 宽度的 block 布局间距不正确，不知道为什么

Question

我将自定义容器应用于 WordPress 类别模板文件，将宽度设置为 50%，将其向左浮动，但在第三次出现后，布局与预期不符。

我已经尝试更改显示类型，检查是否在其他浏览器上再次出现(它出现在 Chrome 和 Mozilla Firefox 中)。我还尝试对容器应用 clearfix。

.clearfix::after {
    content: "";
    clear: both;
    display: table;
}

.category .post-block {
    width: 50%;
    padding: 1em;
    float: left;
}

https://imgur.com/a/JtdcN3L (还没有足够的代表直接发布图片)

观察到的问题位置:

https://streamershaven.blog/category/hardware/

Answer 1

您必须将填充、边距和边框视为总元素宽度的一部分。

“内容框”框模型:

“元素总宽度=宽度+左内边距+右内边距+左边框+右边框+左边距+右边距”

The CSS Box Model