La forma más sencilla es hacer una caja que contenga a las dos y centrar esa caja:
Cita: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title>noreligion_79</title>
<style type="text/css">
#contenedor {height:115px;
border: 1px solid #000;
width:880px;
position: relative;
margin: 0 auto;
top: 193px;
}
#Layer1, #Layer2 {position:absolute; width:200px; height:115px;top: 0;}
#Layer1 {background-color: #00f;left: 0;}
#Layer2 {background-color: #f00;right: 0;}
</style>
</head>
<body>
<div id="contenedor">
<div id="Layer2"></div>
<div id="Layer1"></div>
</div>
</body>
</html>
Les pongo fondos y un borde a la contenedora para que se vea.