<!DOCTYPE html>
<html>
<head>
<style>
#outer-div {
width: 100%;
text-align: center;
background-color: #0666a3
}
#inner-div {
display: inline-block;
margin: 0 auto;
padding: 3px;
background-color: #8ebf42
}
</style>
</head>
<body>
<div id="outer-div">
<div id="inner-div"> I am a horizontally centered div.</div>
</div>
</body>
</html>