【发布时间】:2011-10-12 22:49:37
【问题描述】:
我在一个类中有三个 div 元素,在 html 文档中是这样的:
<div class="content">
<div id="content_head">
<!--CONTENT HEAD CODE-->
</div>
<div id="between_ads">
<!-- ADS HERE -->
</div>
<div id="content_middle">
<!--CONTENT MIDDLE CODE-->
</div>
</div>
这些的css代码:
.content
{
position: relative;
width: 75%;
float: left;
left: -52px;
margin: 5px 0 10px 0;
border-right: 1px solid #D9D9D9;
}
.content #content_head
{
/*position: relative;*/
width: 100%;
float: left;
border-bottom: 1px solid #D9D9D9;
}
.content #content_middle
{
/*position: relative;*/
width: 100%;
float: left;
margin: 5px 0 0 0;
border-top: 1px solid #D9D9D9;
border-bottom: 1px solid #D9D9D9;
}
/*BETWEEN ADVERTS*/
.content #between_ads
{
position: static;
width: 100%;/*737px;*/
height: 10px;
/*margin: 302px 0 0 -17px;*/
margin: auto;
padding: 0;
background: #000;
}
/*BETWEEN ADVERTS*/
问题是,BETWEEN ADVERTS 的结果代码如下所示: http://i.stack.imgur.com/ZU2FD.png - 窗口“Polecane”上方的黑色条以蓝色突出显示 - 但此 div 元素应放置在此处: http://i.stack.imgur.com/ww0Ko.png - 黄色突出显示在哪里。
将 .content 设置为 position: absolute 并设置为 relative 完全制动 .content 类的布局. 我对 html 和 css 很陌生,但仍然不是所有内容都理解。 干杯
【问题讨论】:
-
不清楚,在这里创建一个工作演示link
标签: css class firefox html positioning