html - 如何在不考虑浮动元素的情况下对齐元素中心的文本

Question

好的，我得到了这个标记

<th class="ai1ec-weekday <?php if( $day['today'] ) echo 'ai1ec-today' ?>">
    <span class="ai1ec-weekday-date"><?php
    echo Ai1ec_Time_Utility::date_i18n( 'l', $date, true );
    ?> </span>
</th>

它产生这个输出，因为跨度有text-align: center

现在我想添加一个浮动到右侧的按钮

<th class="ai1ec-weekday <?php if( $day['today'] ) echo 'ai1ec-today' ?>">
    <div class="btn-group pull-right">
        <button class="btn ai1ec-reveal-events"><?php _e( 'Reveal all events', AI1EC_PLUGIN_NAME ) ?></button> 
    </div>
    <span class="ai1ec-weekday-date"><?php
    echo Ai1ec_Time_Utility::date_i18n( 'l', $date, true );
    ?> </span>
</th>

这就是我得到的

我想得到的是 mondais 仍然像以前一样居中，但我想在不使用绝对定位的情况下做到这一点（当然，如果可能的话）

CSS（我的意思是引导 CSS 除外）

.ai1ec-week-view th .ai1ec-weekday-date,
.ai1ec-oneday-view th .ai1ec-weekday-date {
  font-size: 10.5pt !important;
  font-weight: normal !important;
}
.ai1ec-week-view th .ai1ec-weekday-day {
  font-size: 9pt !important;
  font-weight: normal !important;
}
.ai1ec-month-view th, .ai1ec-oneday-view th {
    text-align: center !important;
}

Answer 1

看到这种方法： http: //jsbin.com/uxejes/1/edit
（仅在 Fx18 和 Chrome 上测试）

相关的CSS

button {
  float: right; 
  margin-right: -100%;
  position: relative;
  left: -100%;
}

span {
  display: block;
  text-align: center;
}

按钮（带有position: relative）不会影响span元素内包含的文本的位置