Html IE7显示:块
我有两个跨度标签,其中有一个标签作为图库的按钮,我使用display:block来定位它们。这在除IE7之外的所有浏览器中都能正常工作。两个按钮都移到了多媒体资料的右侧。以下是我为他们使用的CSS代码:Html IE7显示:块,html,css,internet-explorer-7,Html,Css,Internet Explorer 7,我有两个跨度标签,其中有一个标签作为图库的按钮,我使用display:block来定位它们。这在除IE7之外的所有浏览器中都能正常工作。两个按钮都移到了多媒体资料的右侧。以下是我为他们使用的CSS代码: .prv_button{ float:left; height:227px; width:15px; position:absolute; display:block; overflow: hidden; } .prv_button a{ background-image:url(.
.prv_button{
float:left;
height:227px;
width:15px;
position:absolute;
display:block;
overflow: hidden;
}
.prv_button a{
background-image:url(../images/gal_prv.jpg);
background-repeat:no-repeat;
height:227px;
width:15px;
display:block;
position:relative;
overflow: hidden;
}
.nxt_button{
height:227px;
width:15px;
float:left;
position:absolute;
display:block;
overflow: hidden;
left:432px;
}
.nxt_button a{
background-image:url(../images/gal_nxt.jpg);
background-repeat:no-repeat;
height:227px;
overflow: hidden;
width:15px;
display:block;
position:relative;
}
如果你需要更多的信息,请告诉我
谢谢。我不确定我是否理解您想要实现的目标,但在我看来,您可以做到这一点,而无需浮动任何内容,使用绝对定位或将图像显示为背景。我假设
.outer\u gwrap
具有显示:内联块代码>
CSS:
HTML:
我必须为IE7使用样式表,这样当使用不同的方法为IE定位时,它不会在其他浏览器中取消定位>这是所有HTML的顺序。。抱歉,它的布局太差了..把它放在一个JsFiddle()中
.prv_button{
display:inline-block;
vertical-align:top;
width:15px;
}
.prv_button a{
vertical-align:top;
}
.prv_button img{
border-width:0px;
}
.nxt_button{
display:inline-block;
vertical-align:top;
width:15px;
}
.nxt_button a{
vertical-align:top;
}
.nxt_button img{
border-width:0px;
}
.outer_gwrap{
display:inline-block;
width:834px;
zoom: 1;
*display: inline;
}
<div class="gallery" >
<span class="prv_button">
<a href=""><img src="../images/gal_prv.jpg"></a>
</span>
<div class="outer_gwrap">
<ul class="inner_gwrap">
<li><a target="_blank" href=""><img border="0" src=""></a></li>
<li><a target="_blank" href=""><img border="0" src=""></a></li>
<li><a target="_blank" href=""><img border="0" src=""></a></li>
<li><a target="_blank" href=""><img border="0" src=""></a></li>
<li><a target="_blank" href=""><img border="0" src=""></a></li>
<li><a target="_blank" href=""><img border="0" src=""></a></li>
<li><a target="_blank" href=""><img border="0" src=""></a></li>
<li><a target="_blank" href=""><img border="0" src=""></a></li>
<li><a target="_blank" href=""><img border="0" src=""></a></li>
</ul>
<ul class="inner_gwrap">
<li><a target="_blank" href=""><img border="0" src=""></a></li>
<li><a target="_blank" href=""><img border="0" src=""></a></li>
<li><a target="_blank" href=""><img border="0" src=""></a></li>
<li><a target="_blank" href=""><img border="0" src=""></a></li>
</ul>
</div>
<span class="nxt_button">
<a href=""><img src="../images/gal_nxt.jpg"></a>
</span>
</div>