What is the best practice is in the case of altering the render order of elements on a webpage. For example, I have two DIVs that are to be displayed on a page:

<div id="appleSection">
    <!-- Apple DIVs, content, form elements, etc -->
</div>

<div id="orangeSection">
    <!-- Orange DIVs, content, form elements, etc -->
</div>

Depending on user selection (perhaps by country or something), the order which the DIVs are presented to the user can differ. Certain conditions present appleSection above orangeSection, and for other conditions, their order is reversed.

If the core logic of the page is the same regardless, is it a best practice to determine order on the server-side (perhaps via two pages that differ in the order of the DIVs), or is it more appropriate to have just a single page and use CSS to control whether appleSection is above orangeSection or vice versa?