当浮动的对象元素在里面时填充

时间:2010-10-24 15:52:42

标签: css css-float padding

我有以下html:

<div class="wrapper">
    <div id="header">
        <img alt="Giannis Simeonidis" src="logo2.png" width="300" height="220"/> 
        <object width="550" height="200" id="banner">
            <param name="movie" value="banner.swf" />
            <embed src="banner.swf" width="550" height="200"  
                    wmode="transparent" 
                    type="application/x-shockwave-flash">
            </embed>
        </object>
        <div id="menu">
          <object width="600" height="20">
             <param name="movie" value="menu.swf" />
             <embed src="menu.swf" width="600" height="20"  
                    wmode="transparent" 
                    type="application/x-shockwave-flash">
              </embed>
         </object> 
        </div>
    </div><!--End of header-->
</div>

和css是:

#wrapper{
 /*background: url(header_bg.jpg) repeat-x;*/
 background: url(container_bg2.png) repeat-y;
 margin: 0 auto;
 margin-top: 20px;
 width: 900px;
}


#header{
 width: 900px;
 padding: 0 10px;
}

#banner{
 float: right;
}

#menu{
 clear: right;
 padding-left: 13px;
}

由于某种原因,应用于#header的正确填充不起作用;有什么想法吗?

1 个答案:

答案 0 :(得分:0)

包装纸的宽度为900px。 标题的宽度为900px + 10px Left Padding + 10px Right Padding = 920px。

你试图在一个900px div中安装一个920px div。要么将包装器扩大到920px,要么将包头缩短到880px。