A menudo he hecho diseños que incluían un borde fijo en el body. La verdad es que este tipo de bordes quedan bien si van por encima del contenido pero si hacemos un div sin color de fondo pero con borde y lo ponemos encima de todo, nos anula el contenido; lo podemos ver pero no podemos interactuar.


borderbody

Para poder tener nuestro borde por encima y poder interactuar con el contenido de la web deberemos crear cuatro divs, uno para cada lado (yo sugiero, siempre, hacer varias clases para aprovechar propiedades):

<div id="lineas">
        <div class="linea vertical top"></div>
        <div class="linea lateral right"></div>
        <div class="linea vertical bottom"></div>
        <div class="linea lateral left"></div>
</div>

Lo del contenedor “lineas”, realmente no hace falta pero siempre me gusta agrupar los elementos similares para en un momento dado aplicar una propiedad o simplemente esconderlos.

Ahora es el turno del CSS:

div.linea{
	/* posición fija en la página, aunque hagan scroll */
	position:fixed;
	border-style:solid;
	/* Si quiero cambiar el color del borde de todos */
	border-color:#000000;
	/* por encima del contenido */ 
	z-index:100000; 
}
div.linea.lateral{ /* Lo engancha arriba y abajo */
	top:1em;
	bottom:1em;
	width:0;
}
div.linea.lateral.left{ /* el de la izquierda */
	left:1em;
	border-width:0 0 0 1px;
}
div.linea.lateral.right{ /* el de la derecha */
	right:1em;
	border-width:0 1px 0 0;
}
div.linea.vertical{ /* Lo engancha a derecha y a izquierda */
	right:1em;
	left:1em;
	height:0;
}
div.linea.vertical.top{ /* el de la arriba */
	top:1em;
	border-width:1px 0 0 0;
}
div.linea.vertical.bottom{ /* el de la abajo */
	bottom:1em;
	border-width:0 0 1px 0;
}

Realmente lo que hacemos es crear divs delgaditos que forman lineas, las encajamos y así no obstaculizan la navegabilidad.