Fixed elements that have a right margin relative to a content element

dabblet.css

/**
 * Fixed elements that have a right margin relative to a content element
 * http://stackoverflow.com/q/12469476/707111 
 */

html, body {
	height: 100%;
	margin: 0;
}

#button-wrapper {
	bottom: 40px;
	left: 50%;
	margin-left: 350px;
	position: fixed;
}

#button {
	background-color: red;
	padding: 5px;
	position: absolute;
	right: 10px;
	white-space: nowrap;
}

#content {
	margin: 0 auto;
	width: 700px;
	min-height: 100%;
	background-color: #eee;
}​

dabblet.html

<div id="content">this is my page</div>
<div id="button-wrapper">
    <div id="button">magic button</div>
</div>

settings.json

{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}