Flexbox调整内容不起作用（孩子右侧有多余的空白）

Question

很抱歉，如果这是一个愚蠢的问题，但我正在拔头发，因为我看不到为什么这不能正常工作。我的代码的基本知识如下：

.row {
    border: 2px solid goldenrod;
    display: flex;
    justify-content: center;
}

.one_half {
    width: 50%;
    border: 2px solid green;
}

现在，这在虚拟页面上绝对可以正常工作，但是我正尝试将其合并到Wordpress模板页面中，由于某种原因，每个孩子的右边都有10-15px的空白，我似乎看不到转移。我尝试过更改类名，以防发生冲突等情况，但是我无法接受。只是想让所有东西都填满两个盒子，直到最大孩子的最大身高（在本例中为图像）并使所有东西居中，将页面分成50/50页。

HTML如下：

<div class="row">
  <div class="one_half">
    Left Side
  </div>
  <div class="one_half">
    Right Side
  </div>
</div>