61,112
社区成员
发帖
与我相关
我的任务
分享display:block在IE7 8中失效的问题
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7">
<title>无标题文档</title>
<style type="text/css">
body{margin:0; background:#FFF}
.viewBack{position:absolute; font-size:100px; color:#6B90DA; font-weight:bold; text-align:left; top:0; left:0; height:600px; line-height:600px; width:200px; cursor:pointer; display:block; }
.viewBack a,.viewBack a:visited{display:block; text-decoration:none; color:#6B90DA;}
.viewBack a:hover{font-size:110px; color:#6B90DA!important; text-decoration:none}
.viewForward{position:absolute; font-size:100px; color:#6B90DA; font-weight:bold; text-align:right; top:0; right:0; height:600px; line-height:600px; width:200px; cursor:pointer; display:block}
.viewForward a{display:block; zoom:1; height:600px; width:200px}
.viewForward a,.viewForward a:visited{display:block; text-decoration:none; color:#6B90DA;}
.viewForward a:hover{font-size:110px; color:#6B90DA!important; text-decoration:none}
</style>
</head>
<body>
<div style="height:600px; width:960px; position:relative; margin:0 auto">
<div style="text-align: center;">
<a href="#"><img src="http://www.deskcity.com/picture/image_url/58150/FGHJ_47020.jpg" width="800" height="600" title="" alt="" border="0"></a>
</div>
<span class="viewBack"><a href="#" title="上一张">< </a></span>
<span class="viewForward"><a href="#" title="下一张"> ></a></span>
</div>
</body>
</html>在IE6和FF中向左向右的箭头的有效区域是600X200像素，覆盖了一部分图片，鼠标进入那个区域都会变成手的形状
可是在IE7和IE8中无效，给A标签加宽度和高度也不好使，请问是为什么呢？
求解决方案
...全文
请发表友善的回复…
发表回复
