语义UI：如何处理额外的填充？

Question

我尝试使用语义用户界面创建模态，并上传了一个示例on jsfiddle，以便提供有关代码的更多详细信息：

<div id="modal" class="ui modal">
  <i class="close icon"></i>
  <div class="ui menu">
    <div class="ui header item">
      Title
    </div>
  </div>
  <div class="ui secondary pointing menu">
    <a class="active item">
      Item
    </a>
  </div>
  <div class="ui segment">
    <p>
    my content here
    </p>
  </div>
</div>

事实上，有三个额外的填充：

1. 顶部菜单的一个上方（由关闭图标＆＃39;引起）
2. 顶部菜单（＆＃34;标题＆＃34;）和辅助指点菜单（＆＃34;项目＆＃34;：缺点）之间的第二个
3. 最后一个，在辅助指点菜单（＆＃34;项目＆＃34;）和段落（＆＃34;我的内容在这里＆＃34;）之间。

在我的情况下，这些填充是不必要的，并且它们不应该应用于UI。

我是语义用户界面的新用户，而且我并不确切地知道我为了逃避这些填充而错过了什么。

非常感谢任何帮助。