如何使用语义-ui rail元素

uir*_*han 4 html css semantic-ui

我正在尝试使用semantic-ui创建一个垂直左侧菜单.管理菜单之类的东西.为了使它对齐到左边,我尝试使用semantic-ui提供的rails元素.但我的内容不明显.

我尝试使用网站中提供的示例代码.但结果仍然相同.我在这里想念的是什么?

<body>
  <div class="ui segment">
    <div class="ui left dividing rail">
        <div class="ui segment">
            Left Rail Content
        </div>
    </div>
    <div class="ui right dividing rail">
        <div class="ui segment">
            Right Rail Content
        </div>
    </div>
    <p></p>
    <p></p>
  </div>
</body>
Run Code Online (Sandbox Code Playgroud)

我看到semantic-ui文档站点也使用类似的方法来显示他们的正确菜单.如果这不是创建管理菜单的最佳方法,请使用语义ui建议任何其他更好的方法.

小智 5

您需要指定中心元素的大小和位置.例如:

<body>
  <div class="ui segment" style="left:400px;width:600px;">
    <div class="ui left dividing rail">
        <div class="ui segment">
            Left Rail Content
        </div>
    </div>
    <div class="ui right dividing rail">
        <div class="ui segment">
            Right Rail Content
        </div>
    </div>
    <p></p>
    <p></p>
  </div>
</body>
Run Code Online (Sandbox Code Playgroud)