Question

您好，我想知道是否有解决以下问题的NICE解决方案：

<div id="container">
<div id="left_sidebar">blablabla</div>
<div id="right_sidebar">blablabla</div>
<div id="main_content">blablabla</div>
</div>

在网站的桌面版本中，CSS类似于：

#main_content {
margin: 0 auto;
width: 45%;
}

#left_sidebar {
float:left;
width:25%;
}

#right_sidebar {
float:right;
width:25%;
}

在移动/响应版本中，目标是首先让主要内容。但是，HTML的顺序不应该改变（我知道有解决方案）。是否可以使用纯CSS （在媒体查询中）让main_content出现在移动版本的left_sidebar / right_sidebar之前？

Answer 1

最后我发现stackoverflow上的另一个主题处理同样的问题。提供的解决方案应该正是所需要的。