位置:绝对项目不显示 [英] Position: Absolute items does not display

问题描述

大家好...我有这个网站 African TV ，我正在做CSS，但问题出在IE ... im使用绝对位置将横幅广告放置在屏幕上方...在其他浏览器中可以正常工作，但是在IE中，它不会显示div标签...这是我的CSS代码

Hi guys... I have this website African TV and im doing its css but the problem is with IE... im using absolute position to position my banner on top of my screen... its working fine in other browser but when it comes to IE it does not display the div tagss... here is my css code

#center_container{
    border: 1px solid transparent;
    margin-left: auto;
    margin-right: auto;
    min-height: 200px;
    position: relative;
    width: 1013px;
}

#banner_image{
    float: left;
    height: 153px;
    left: 12px;
    position: absolute;
    top: 35px;
    width: 309px;
    display: block;
    border: 1px solid;
}
#search{
    border: 0 solid transparent;
    display: block;
    height: 29px;
    width: 400px;
    left: 380px;
    position: absolute;
    top: 170px;
}
#note{
    color: #FFFFFF;
    display: block;
    left: 380px;
    position: absolute;
    text-align: left;
    top: 56px;
    width: 400px;
}

这是我的HTML文件

and heres my HTML file

<div id="center_container">
<div id="header">

<div id="globe">
						
  <img src="images/international.png" id="banner_image" />
  <div id="note">High Definition live streaming videos, live to you 24/7. Subribe now..</div>
  <div id="search">
        <form method="POST" action="">
	<input type= "text" id="search_text" name="search"/>
	<input type= "submit" value="Search" id="search_button" name="search_button" />
	</form>
  </div>
  <div id="icons">
	<ul>
 	<li><a href= "" /><img src = "images/facebook.png" /></a></li>
	<li><a href= "" /><img src = "images/digg.png" /></a></li>
	<li><a href= "" /><img src = "images/rss.png" /></a></li>
        <li><a href= "" /><img src = "images/search.png" /></a></li>
	<li><a href= "" /><img src = "images/window_gray.png" /></a></li>
	<li><a href= "" /><img src = "images/meet.png" /></a></li>
	</ul>
 </div>

</div>
</div>
</div>

具有id"globe"且其绝对位置绝对值的div标签可以正常工作并显示div标签...但是在地球内部，这是另一个div标签，例如搜索，注意...该标签具有position属性:绝对也是如此，但是问题是它没有出现在网站上...我该如何解决呢?请帮忙...尽可能多地我要使用绝对作为定位

the div tag with an id "globe" and its position absolute is working fine and displaying the div tag... but inside the globe which is the other div tag such as search, note... this tag have an attribute of position: absolute as well but the problem is its not appearing on the site... how do i solve this please help... as much as possible i want to use absolute as positioning

推荐答案

在您的样式中添加z-index:0 [0或任何正数].

Add z-index:0 [0 or any positive number] to your styles.

尝试使用此CSS，而不是您的

try this css instead of yours

#center_container{
    border: 1px solid transparent;
    margin-left: auto;
    margin-right: auto;
    min-height: 200px;
    position: relative;
    width: 1013px;
}
 
#banner_image{
    float: left;
    height: 153px;
    left: 12px;
    position: absolute;
    top: 35px;
    width: 309px;
    display: block;
    border: 1px solid;
}
#search{
    border: 0 solid transparent;
    display: block;
    height: 29px;
    width: 400px;
    left: 380px;
    position: absolute;
    top: 170px;
    z-index:1000:
}
#note{
    color: #FFFFFF;
    display: block;
    left: 380px;
    position: absolute;
    text-align: left;
    top: 56px;
    width: 400px;
    z-index:1000:
}

这篇关于位置:绝对项目不显示的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！