响应式中心侧边栏在移动设备上

Question

在平板电脑或笔记本电脑上，帖子和侧边栏将出现在左侧或右侧，而侧边栏则相反。例如：

Sidebar | Post

...或...

Post | Sidebar

问题在于移动设备 - 示例 1 中的帖子或示例 2 中的侧边栏将显示为左对齐，而我希望它们居中堆叠。我不能给他们每个人 100% 的宽度 - 即使在移动设备上，这也是我想要的。

我确实尝试了一些使 div 居中的技术；举个例子，我认为我可以像这样在帖子或侧边栏上使用响应式 div 方法：

<div class="row">
    <div class="col-xs-12 col-md-8"><!-- POST --></div>
    <div class="col-xs-6 col-md-4">
        <div class="col-md-2"></div>
        <div class="col-md-8"><!-- SIDEBAR --></div>
        <div class="col-md-2"></div>
    </div>
</div>

... 反之亦然，帖子居中，侧边栏位于顶部。在这两种情况下，在移动设备上，居中的 div (col-md-8) 仍然是左对齐的。

只是为了可视化目标，在笔记本电脑或平板电脑上，它看起来像：

Sidebar | Post

或

Post | Sidebar

在手机上，它看起来像：

Sidebar-Centered
Post-Centered

更新：

使用xs 测试移动：

<div class="row">
    <div class="col-xs-12 col-md-8"><!-- POST --></div>
    <div class="col-xs-6 col-md-4">
        <div class="col-xs-3 col-md-2"></div>
        <div class="col-xs-12 col-md-8"><!-- SIDEBAR --></div>
        <div class="col-xs-3 col-md-2"></div>
    </div>
</div>

理论上，这应该有助于移动设备，但仍然没有骰子。

Answer 1

您的 css 不会有其他问题。 您可以使用 css 修复它。

如需更多帮助，可否分享您网页的链接？这样我们就可以配置出究竟是什么问题。