css-dom-position.css

/*
<div class="results">

	<div class="results_top">
		<h2>Results</h2>
	</div>

	<div class="results_bottom">
		<div class="share"></div>
	</div>
</div>

*/

.share {
	dom-position: auto;
}

@media (min-width: 600px) {
	.share {
		dom-position: .results .results_top;
	}
}

Hmmm... that's pretty nifty, especially the image example in http://dev.w3.org/csswg/css-flexbox/#overview, but looks like it would get quite complex to use for bigger pages.

If you don't know or care how many elements you have, you just know you want X element to move to the top of Y element on certain screen sizes, I think dom-position looks more readable. (And it's just CSS selectors, which we all know, so less of a learning curve!)

Following the rules of progressive enhancement, it's normally easier to position things differently on larger screens when design for mobile devices first. :)

Another possibility is the CSS Grids. But as always, it's not safe to use all of this wonderful new stuff yet because people don't know how to upgrade IE. :P