语义UI不组织网格

Question

我正在开发一个基于Semantic UI的项目并使用它的网格系统。使用网格的第一部分代码工作正常：

<div className='ui grid fluid container'>
  <div className='stackable six wide column' id='logo'>
    <img src='/images/home/icone-logo.svg' />
  </div>
  <div className='twelve wide mobile nine wide tablet nine wide computer column' id='nome'>
    <img src='/images/home/nome-logo.svg' />
    <br />
    <br />
    <span id='slogan'>Um sistema de estudo feito para você</span>
  </div>
</div>

在第二部分，元素加载ui和网格样式，但不加载应该组织它的列样式。

<div className='ui grid fluid container'>
  <div className='four wide cloumn'>
    <img src="/images/home/ALUNO.svg" />
  </div>
  <div className="four wide cloumn">
    <img src="/images/home/prof.svg" />
    <div className="solucao-content">
      <p>Lorem ipsom</p>
    </div>
  </div>
  <div className="four wide column">
    <img src="/images/home/pais.svg" />
    <div className="solucao-content">
      <p>Lorem ipsom</p>
    </div>
  </div>
  <div className="four wide column">
    <img src="/images/home/escola.svg" />
    <div className="solucao-content">
      <p>Lorem ipsom</p>
    </div>
  </div>
</div>

第一部分位于body标签下，第二部分位于另一个div之下。

即使我尝试在第二个代码的位置加载相同的第一个代码，它也无法正确呈现。