如何在语义ui中对齐中心的2个块？

Question

对于我的项目（语义ui），我想对齐2个块。两个块都应显示在页面的水平中心。块1的宽度并不重要，因为它是一个小块。块2应为12列宽。我怎么能这样做？

第1区：

<img class="ui small circular image" src="images/large/stevie.jpg">
<h1>Stevie Wonder</h1>
<p><a href="#">@stevie</a></p>
<p>Amsterdam, The Netherlands</p>
<button class="ui button">Edit Profile</button>

第2栏：

<div class="ui top attached tabular menu">
    <div class="active item">My Bla's</div>
    <div class="item">Favorite Bla's</div>
</div>
<div class="ui bottom attached tab segment">
    <div class="ui divided items">
        <div class="item">
            <div class="image">
                <img src="/images/wireframe/image.png">
            </div>
            <div class="content">
                <a class="header">12 Years a Slave</a>
                <div class="meta">
                    <span class="cinema">Union Square 14</span>
                </div>
                <div class="description">
                    <p></p>
                </div>
                </div>
            </div>
        </div>              
    </div>
</div>

完整代码：

<div class="ui main container">
      <div class="row">
        <div class="column">
          <img class="ui small circular image" src="images/large/stevie.jpg">
          <h1>Stevie Wonder</h1>
          <p><a href="#">@stevie</a></p>
          <p>Amsterdam, The Netherlands</p>
          <button class="ui button">Edit Profile</button>
        </div>
      </div>
      <div class="row">
        <div class="column">
          <div class="ui top attached tabular menu">
            <div class="active item">My Bla's</div>
            <div class="item">Favorite Bla's</div>
          </div>
          <div class="ui bottom attached tab segment">
            <div class="ui divided items">
              <div class="item">
                <div class="image">
                  <img src="/images/wireframe/image.png">
                </div>
                <div class="content">
                  <a class="header">My Neighbor Totoro</a>
                  <div class="meta">
                    <span class="cinema">IFC Cinema</span>
                  </div>
                  <div class="description">
                    <p></p>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>

Answer 1

1. 为block1和block 2制作一个公共div
2. 申请css。

HTML：

<div class="main">
<div class="block1">---</div>
<div class="block2">---</div>
</div>

的CSS：

.main
{
   width:suitable size(block1+block2) in pixel
   margin:0 auto;
}
.block1
{
width:block1's width;
float:left;
}
.block2
{
width:block2's width;
float:right;
}