样式问题：a-tabs标签与表格中间放一个calender

a-tabs样式问题

     要求a-tabs中间放一个calender,写相对定位绝对定位日历不能点了。重点在样式。

 <div class="calendar" style="margin-top: -1460px;margin-bottom: 700px;">
        <a-calendar>
          <ul slot="dateCellRender" slot-scope="value" class="events">
            <li v-for="item in getListData(value)" :key="item.content">
              <a-badge :status="item.type" :text="item.content" />
            </li>
          </ul>
          <template slot="monthCellRender" slot-scope="value">
            <div v-if="getMonthData(value)" class="notes-month">
              <section>{{ getMonthData(value) }}</section>
              <span>Backlog number</span>
            </div>
          </template>
        </a-calendar>
      </div>

.foot-safety .ant-table-content{
  margin-top:800px
}

要求样式：