Html 右浮动和左浮动的元素在语义ui中脱离容器

正如你在小提琴上看到的： 底部的两个按钮部分位于容器外部。它发生在我将它们左右浮动的时候。如何将它们保存在容器内

HTML:

---

容器也使用float:left

 .ui.container{
      float: left; // you could also use display: inline-block;
      width: 100% !important;
    }

---

在浮动元素后添加

clear:both

，或在父框中添加

overflow:hidden

.main.container {overflow: hidden}

---

所有给出的答案都不使用语义用户界面的功能。如果您想以语义用户界面的方式进行操作，则可以使用清除命令：

<div class="ui main center aligned text container clearing segment">
</div>

.main.container {overflow: hidden}

<div class="ui main center aligned text container clearing segment">
</div>