Html 容器分割盒阴影

我在主#container div周围放置了一个方框阴影，尽管#footer div位于#container div内部，但阴影不会显示在#footer div周围

在这里拉小提琴：

你能帮帮我吗？ 多谢各位

HMTL代码：

<div id="container">

<div id="banner">
</div><!--end of banner-->

<div id="menubar">
<div id="nav">
<ul>
  <li><a href="#">HOME </a></li>
  <li><a href="#">FACILITATI</a></li>
  <li><a href="#">LOCATIE</a></li>
  <li><a href="#">GALERIE</a></li>
  <li><a href="#">TARIFE</a></li>
  <li><a href="#">CONTACT</a></li>
  <li><a href="#"><strong>OFERTE</strong></a>
  <ul>
    <li><a href="#">SEMINARII </a></li>
    <li><a href="#">REVELION 2015 </a></li>
    <li><a href="#">CRACIUN 2015 </a></li>
  </ul>      
  </li>
</ul><!--end menu ul-->
</div>
</div><!--end of menubar-->

<div id="content">
<div id="content_text">spozitie in orice perioada a anului noua    camere       duble si un apartamespozitie in orice perioada a anului noua camere duble si un apartamespozitie in orice perioada a anului noua camere duble si un apartamespozitie in orice perioada a anului noua camere duble si un apartame.</div> 
<div id="poze1"><div id="content_div1"><img src="images/apart.jpg" width="233" height="154" />spozitie in orice perioada a anului noua camere duble si un apartame</div>
<div id="content_div1"><img src="images/ski.jpg" width="233" height="154" />spozitie in orice perioada a anului noua camere duble si un apartame</div>
<div id="content_div1"><img src="images/conf.jpg" width="233" height="154" />spozitie in orice perioada a anului noua camere duble si un apartame</div></div>

</div><!--end of content-->



<div id="footer"><p>spozitie in orice per</p>
<img src="images/fbb.jpg" width="102" height="34" />

</div><!--end of footer-->
</div><!--end of container div -->

orice Perioda的spozitie a anului Nou Camer duble si un Apartames Pozitie a anului Nou Camer duble si un Apartames Pozitie a orice Perioda的anului Nou Camer duble si un Apartames Pozitie a anului Nou Camer duble si un Apartames Pozite a anului Nou Camer duble si un Apartames Pozitie in orice Perioda的anului Nou Camer duble si un Apartames。
奥里斯佩里奥达的斯波兹蒂酒店
奥里斯佩里奥达的斯波兹蒂酒店
奥里斯佩里奥达的斯波兹蒂酒店
奥里斯珀的斯波兹蒂

CSS代码：

<style type="text/css">
body {
margin-left: 0px;
margin-top: 0px;
background-color: #FFC;
font-family: "Roboto Slab";
background-image: url(images/fulg.jpg);
background-repeat: repeat;
}
#container {
padding: 0px;
height: auto;
margin-left: auto;
margin-right: auto;
width: 100%;
border-top-width: 0px;
border-right-width: 0px;
border-bottom-width: 0px;
border-left-width: 0px;
width: 800px;
box-shadow: 3px 3px 2px #000;
}
#banner {
margin: 0px;
padding: 0px;
height: 328px;
width: 800px;
background-image: url(images/banner_original.jpg);
background-repeat: no-repeat;
}
#menubar {
margin: 0px;
width: 800px;
height: 30px;
text-align: center;
vertical-align: middle;
background-color: #663200;
border-top-width: 1px;
border-top-style: solid;
border-right-style: none;
border-bottom-style: solid;
border-left-style: none;
border-top-color: #FC0;
border-bottom-color: #FC0;
border-bottom-width: 1px;
}

#nav ul {
list-style-type: none;
padding: 0px;
margin: 0px;
position:relative;

}
#nav ul li {
display: inline-block;
text-align: center;
vertical-align: middle;
padding: 0px;
margin: 0px;
}
#nav ul li a:hover {
background-color: #FFCC00;
color: #663200;

}

#nav ul li a{
padding: 0px;
margin: 0px;
display: block;
padding-left: 20px;
padding-right: 20px;
text-decoration: none;
text-align: center;
color: #FC0;
line-height: 30px;
}
#nav ul li:hover > ul {
display: block;


}
#nav ul li:hover {
background-color: #FFCC00;

}
#nav ul ul {
background-color: #FFCC00;
color: #663200;
padding: 0px;
position: absolute;
display: none;
right: 0;
top: 100%;
}
#nav ul ul li {
display: block;

}
#nav ul ul li a{
color: #663200;
}

#nav ul ul li a:hover{
background-color: #FFCC00;
}
#nav ul li:hover a{
color: #663200;

}
#nav ul ul li:hover a{
background-color: #DFB300;
}

#content {
padding: 0px;
height: auto;
width: 800px;
background-color: #663200;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
font-size: 15px;
font-family: "Roboto Slab";
}
#content_text {
padding: 15px;
color: #FC0;
text-align: center;
}
#content_div1 {
width: 227px;
font-family: "Roboto Slab";
color: #FC0;
text-align: center;
display: inline-block;
vertical-align: top;
padding-right: 18px;
padding-bottom: 10px;
}
#poze1 {
text-align: center;
padding-left:9px;
}
#content_div1 img {padding-bottom:15px;}
#footer {
padding: 0px;
margin: 0px;
background-color: #663200;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #FC0;
font-family: "Roboto Slab";
color: #FC0;
font-size: 14px;
vertical-align: middle;
height: 50px;
width: 800px;
float: left;
}
#footer img {float:right; padding-top:7px; padding-right:100px}
#footer p { padding-left:330px; float:left;}
</style>

身体{
左边距：0px；
边际上限：0px；
背景色：#FFC；
字体系列：“机器人板”；
背景图片：url（images/fulg.jpg）；
背景重复：重复；
}
#容器{
填充：0px；
高度：自动；
左边距：自动；
右边距：自动；
宽度：100%；
边框顶部宽度：0px；
右边框宽度：0px；
边框底宽：0px；
边框左宽度：0px；
宽度：800px；
盒影：3px 3px 2px#000；
}
#横幅{
边际：0px；
填充：0px；
高度：328px；
宽度：800px；
背景图片：url（images/banner_original.jpg）；
背景重复：无重复；
}
#梅努巴{
边际：0px；
宽度：800px；
高度：30px；
文本对齐：居中；
垂直对齐：中间对齐；
背景色：#663200；
边框顶部宽度：1px；
边框顶部样式：实心；
右边框样式：无；
边框底部样式：实心；
左边框样式：无；
边框顶部颜色：#FC0；
边框底色：#FC0；
边框底宽：1px；
}
#导航ul{
列表样式类型：无；
填充：0px；
边际：0px；
位置：相对位置；
}
#李国荣{
显示：内联块；
文本对齐：居中；
垂直对齐：中间对齐；
填充：0px；
边际：0px；
}
#导航ulli a：悬停{
背景色：#FFCC00；
颜色：#663200；
}
#海军ulli a{
填充：0px；
边际：0px；
显示：块；
左侧填充：20px；
右边填充：20px；
文字装饰：无；
文本对齐：居中；
颜色：#FC0；
线高：30px；
}
#导航ul li：悬停>ul{
显示：块；
}
#nav ul li:悬停{
背景色：#FFCC00；
}
#导航ul{
背景色：#FFCC00；
颜色：#663200；
填充：0px；
位置：绝对位置；
显示：无；
右：0；
最高：100%；
}
#李国宝{
显示：块；
}
#海军ulli a{
颜色：#663200；
}
#导航ulli a：悬停{
背景色：#FFCC00；
}
#nav ul li:悬停a{
颜色：#663200；
}
#nav ul li:悬停a{
背景色：#DFB300；
}
#内容{
填充：0px；
高度：自动；
宽度：800px；
背景色：#663200；
边际上限：0px；
右边距：0px；
边缘底部：0px；
左边距：0px；
字体大小：15px；
字体系列：“机器人板”；
}
#内容与文本{
填充：15px；
颜色：#FC0；
文本对齐：居中；
}
#内容组1{
宽度：227px；
字体系列：“机器人板”；
颜色：#FC0；
文本对齐：居中；
显示：内联块；
垂直对齐：顶部；
右边填充：18px；
垫底：10px；
}
#poze1{
文本对齐：居中；
左侧填充：9px；
}
#content_div1 img{填充底部：15px；}
#页脚{
填充：0px；
边际：0px；
背景色：#663200；
边框顶部宽度：1px；
边框顶部样式：实心；
边框顶部颜色：#FC0；
字体系列：“机器人板”；
颜色：#FC0；
字体大小：14px；
垂直对齐：中间对齐；
高度：50px；
宽度：800px；
浮动：左；
}
#页脚img{float:right；padding top:7px；padding right:100px}
#页脚p{左填充：330px；浮点：左；}

我看不到您的阴影，但请尝试从#页脚中删除float:left，以便页脚一直在容器中移动

您可以添加：

<br style = "clear:both">

在页脚的结束标记之后-将显示您的阴影

---

删除页脚中的

左浮动

浮动：左导致问题。
将其删除或设置为“无/初始”
 删除浮动：页脚css左侧

尝试移除浮动：左侧来自页脚div css。
这会有帮助的。我试过了。
在html中的结束页脚标记后添加

将
.clear{clear:both；}
添加到css文档中。
试试这个。。希望这对你有帮助

更改#容器中的
box shadow
样式

工作正常。谢谢你们！
#footer {
padding: 0px;
margin: 0px;
background-color: #663200;
border-top-width: 1px;
border-top-style: solid;
border-top-color: #FC0;
font-family: "Roboto Slab";
color: #FC0;
font-size: 14px;
vertical-align: middle;
height: 50px;
width: 800px;   
}