Having an issue with a parent container background that drops out after the first child container. The border encompasses the contents properly, but the background disappears.
(PS I have validated the HTML and the CSS)

Here are the excerpts from the HTML and CSS files ...
I'm pretty new at this, so any enlightenment would be much appreciated

...
</head>

<!-- START BODY -->
<body>
<center>
<div class="outer">
<center>

<!-- page header ======================================== -->
<div class="container">
<table width="100%" border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" background="images_Blueberry/head-blueberry.jpg">
<tr>
<td>
<a href="index.htm">
<img border="0" src="images_Blueberry/nav/back.png" style="float: right" width="75" height="38" alt="."/></a>
<h1 class="page-title">'B' is for BUSINESS</h1>
</td>
</tr>
</table>
</div>
<!-- end of page header
***this is where the background stops, the border continues to the end
======================================== -->


<!-- start 3 columns -->
<div class="container">
<div class="span-one-third-1st">
<p>&nbsp;&nbsp;
<a href="../contact.htm#email">
<img border="0" src="images_Blueberry/cnt/contact-icon-email.png" width="30" height="30" alt="SEND US AN EMAIL"/></a>&nbsp;&nbsp;&nbsp;
<a href="../contact.htm#phone">
<img border="0" src="images_Blueberry/cnt/contact-icon-phone.png" width="30" height="30" alt="GIVE US A CALL"/></a>&nbsp;&nbsp;&nbsp;
<a href="../contact.htm#post">
<img border="0" src="images_Blueberry/cnt/contact-icon-snail.png" width="30" height="30" alt="POST A LETTER"/></a>
</p>
<p class="sidebar">
<a class="Links2" href="link_B.htm" alt="BUDGETING">BUDGETING</a></br>
&nbsp;</br>
<a class="Links2" href="link_B.htm" alt="BENEFITS">BENEFITS</a></br>&nbsp;</br>
<a class="Links2" href="link_B.htm" alt="BRANDING">BRANDING</a></br>&nbsp;</br>
<a class="Links2" href="link_B.htm" alt="BIDDING">BIDDING</a></p>
<p class="marginL4"> -yaddah yaddah


/* == CONTAINERS ================================================== */

/* -- main container - white background with deep purple border -- */

.outer {
max-width:900px;
outline: 8px; outline-style: solid; outline-color: #4D0165;
margin: 6px; padding: 2px;
background-color:#ffffff; height: 100%;
}


.container {
text-align: left;
outline: 0px;
background-color:#ffffff;
}