我有一个页面news.html,它是php包含在我的index.html中-在一个#content div中。news.html有另一个div,它浮在右边,有一个垂直线jpg将它与主要内容分开,添加和类似的东西将被放置在那里。
问题是我不能让它达到100%的高度(尽管它可以用于jpg行),我认为原因是一些css问题。我也不能把它放在页脚下面,这样100%高度行就不会覆盖它。我为每个页面使用一个main.css文件。
如果我使用position:fixed for #poll div height 100%有效,但是当放大/缩小浏览器时,我的div移动了,这不是我想要的。我知道有一个min-width属性,但似乎对我不起作用。
下面是我的代码:
索引.html:
//Content div is placed inside a #main table//
<div id="content"><?php include "news.html"?></div>
主文件.css:
html, body{
height:100%;
}
#main{
width:1010px;
height:100%;
z-index:2;
}
#content{
margin-top: 303px;
height:100%;
z-index:1;
}
#footer{
z-index:2;
}
#poll{
height:100%
background-color:rgba(255,0,0,0.6);
float:right;
z-index:1;
}
新闻.html
<div id="poll"><div style="background-image:url(images/vertical.jpg); width:5px; height:100%; background-repeat:repeat-y; vertical-align:top; position:fixed; top:0; z-index:0;"></div>
<div>POLL CONTENT HERE</div>
</div>
2条答案
按热度按时间tsm1rwdh1#
如果使用
z-index
,则至少给一个位置relative
或absolute
那么它会像这样工作:
如何工作
Z-index
***Link here***wfsdck302#
z-index
仅在为元素指定position
属性时才有效。或