1

Hi there I wonder if there is a NICE solution for solving the following problem:

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

In the desktop version of the Website the CSS is something like:

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

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

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

In the mobile/responsive version the aim is to let the main content first. However the order of the HTML should NOT be changed (I know that there are solutions for this). Is it possible with pure CSS (within a media query) to let the main_content appear before the left_sidebar/right_sidebar in the mobile version?

Blackbam
  • 17,496
  • 26
  • 97
  • 150

1 Answers1

0

Well finally I found another topic on stackoverflow dealing with the same problem. The solution provided there should be exactly what is needed.

Switching the order of block elements with CSS

Community
  • 1
  • 1
Blackbam
  • 17,496
  • 26
  • 97
  • 150