Tailwind的justify-between在当前文件中失效的问题求助

我遇到了Tailwind的justify-between属性失效的问题，目前Tailwind渲染出来的实际效果如下：

但我想要实现的预期效果应该是这样的：

下面是我正在开发的日历样式代码块，其中标注了<!--The section is not working -->的部分就是出现问题的地方。我已经尝试用开发者控制台排查，但还是没弄明白到底哪里出错了，希望能得到大家的帮助。

<!-- Calendar Section Start -->
<section class="pt-24">
  <div class="flex">
    <div
      class="calendar-container mx-10 my-5 rounded-md border border-black py-10"
    >
      <div class="appointment-counselor-container mx-5 flex justify-between">
        <div class="text-2xl font-semibold text-green-700">
          <h1>Appointments</h1>
        </div>
        <!-- Counselor toggle -->
        ...
      </div>
    </div>
  </div>
</section>

备注：内容来源于stack exchange，提问作者Rey Vincent Ebreo