第二列为空时居中

Question

我正在基于https://orange-ape.cloudvent.net/billing/expired-credit-card/

建立一个网站

页面中相关的html / css是：

<section class="sidebar sticky">
   <ul>
       <li>
          <a href="#item1" class="active">Top</a>
          <a href="#item2">Bottom</a>
       </li>
   </ul> 
</section>
<section class="tutorial-content">
   { content here }
</section>


.sidebar {
    display: none;
    padding: 0 20px 0 0;
    position: absolute;
    top: 85px;
    width: 200px;
}

.tutorial-content {
    width: 100%;
    margin-left: 230px;
}

有时侧边栏没有内容-意味着html看起来像这样：

<section class="sidebar sticky">
   <ul></ul>
</section>

当侧边栏没有 有内容时，我想将“ tutorial-content”居中在页面中间。

仅在CSS中可行吗？