Html 无法在设置区域内的网格上获取要换行的文本

我试图将两个单独的文本片段放在网格上的同一行上，我希望这些单词在网格的约束（或css边框）内环绕。此时输出为文本未换行。少了什么

<h2 class="text" class="grid_6">Best cheese I've ever tasted!</h2>
<h2 class="text" class="grid_6">Cannot wait to place our next order!</h2>

尝试添加

float:left

---

在CSS中，像这样给出

显示：内联块


CSS

 .text {
        word-wrap:break-word;
        display:inline-block;
}

谢谢，这有一些效果，但是“最好的奶酪”和“不能等待”的文本一个接一个地出现，我试图让它们并排出现。我需要添加其他内容吗？谢谢，由于文本字体的大小，它似乎将其移动到下面的一行。当我将其缩小为小字体时，两个标题都显示在一行上。我的网格是“12”，所以我想如果我把每个H2文本分配为“6”，那么在一行上应该有足够的空间来容纳这两个文本？我需要定义网格大小吗？干杯
 .text {
        word-wrap:break-word;
        display:inline-block;
}