Question

更新：我原本以为这是MatchHeight和FlowType之间的东西，但现在看来使用flexbox css是一个问题。我注释掉了flex css和FlowType的工作原理，但是我需要它来使用flexbox。有什么想法吗？

原始问题：我有一个页面，其中有5个块，其中包含文本和图像。它们被组织成一排，我使用matchheight.js来保持它们的高度和FlowType.js相同，因此文本将在框内调整大小并保持正确的布局。

理想情况下，标题文本的框大小和正文都应该相同。

然而，当页面首次加载时，某些框的文本大小与其他框不同 - 即使它们都具有相同的基本字体大小且框的大小相同。

当我调整窗口大小时，所有内容都会重新计算，字体大小会变得均匀。页面加载时会丢失什么导致文本无法正确调整大小和/或是否有办法在不调整窗口大小的情况下触发重新计算。

这是我用来调用js的代码。

$(document).ready(function() { 
  $('.front-page-guide').flowtype({
     maxFont: 40,
   });
  $('.front-page-guide').matchHeight();
});

所以你可以看到html和css并看到它的实际效果。

视口必须为1200像素或更低才能看到问题。

THX。