我正在使用语义 UI,无法正确设置网格。根据文档,语义 UI 使用 16 列,我试图three
在左侧有一列宽度为 ,在它旁边有一列宽度为thirteen
. 这是它的外观(图片被裁剪):
我已经使用 Bootstrap 很长时间了,现在尝试使用 Semantic UI。我错过了什么?演示
<header>
<div class="mobile hidden">
<div class="ui container">
<div class="ui grid">
<div class="eight column">
<div class="ui secondary menu">
<a class="active item">
Home
</a>
<a class="item">
Messages
</a>
<a class="item">
Friends
</a>
<div class="right menu">
<div class="item">
<div class="ui icon input">
<input type="text" placeholder="Search...">
<i class="search link icon"></i>
</div>
</div>
<a class="ui item">
Logout
</a>
</div>
</div>
</div>
</div>
</div>
</div>
</header>
<div class="clearing"></div>
<div class="ui container">
<div class="mobile hidden">
<div class="ui grid row">
<aside class="three column red">
</aside>
<section class="thirteen column olive">
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Ab doloremque illum quas? Dolore dolorem dolorum ipsum? Commodi error excepturi laboriosam magnam nobis odio suscipit unde! Alias atque dicta reiciendis sapiente!
</section>
</div>
</div>
</div>