Scalable components 2: dialog. Golden ratio positioned. Usage <div class="dialog">Content goes here</div> scale by set .dialog{ font-size: 120%; }

gistfile1.css

.dialog {
  /* layout */
	position: absolute;
	top: 38.20%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	   -moz-transform: translate(-50%, -50%);
	        transform: translate(-50%, -50%);
	/* presentation */
	border: 0.5em solid rgba(0,0,0,0.16);
	border-radius: 0.25em;
	outline: 1px solid #ccc;
	outline-offset: -webkit-calc(-0.5em - 1px);
	outline-offset: -moz-calc(-0.5em - 1px);
	outline-offset: calc(-0.5em - 1px);
	padding: 1em 1.5em;
}