语义 UI：将列设置在中心而不是其内容

Question

尝试使用它，但它也在对齐内容。

<div class="center aligned ui grid">
  <div class="ten wide column">
         <h2 class="ui header">
            Your Blog
            <div class="sub header">A blog application implemented with Semantin-UI/SpringBoot/MongoDB/.</div>
       </h2>
        <div class="ui divided list" th:each="post : ${posts}">
            <div class="item">
                <div class="content">
                    <a class="header" th:text="${post.title}">Title</a>
                    <div id="blogId" th:text="${post.id}" style="display: none">Id</div>
                    <div class="description" th:text="${post.content}">Content</div>
                    <div class="ui divider"></div>
                </div>
            </div>
        </div>
            <a href="/createPost">NewPost</a>
  </div>
  </div>

Answer 1

只需将left aligned添加到您的内在column <div>：

<div class="center aligned ui grid">
  <div class="ten wide left aligned column">
    ...
  </div>
</div>

来源： http://semantic-ui.com/collections/grid.html#specifying-alignment