更新#2:我几乎解决了我所有的问题,除了一个主要的问题。使用相同的结构和CSS,IE7/6显示每个a都有其容器的100%宽度。我不希望这种情况发生。除此之外,一切都还好。有人能启迪我吗?
更新:应该是这样的
我有以下HTML页面(详细说明如下)。 它只是从链接呈现2个样式化按钮。 我的问题是IE6和7呈现它与Firefox,Safari,IE8和Chrome不同,所有这些都正确呈现它。
我已经把头撞向墙壁一整天了,试图在IE6 / 7中使其工作。有人能提供一些建议吗?
谢谢 (xiè xiè)
<html>
<head>
<style>
.niw-button {
background: #1f81c0 url(niw-btn-gradient-normal.png) repeat-x;
border: none;
color: #fff;
display: inline-block;
font-weight: bold;
margin-right: 6px;
min-width: 95px;
padding: 2px;
text-decoration: none;
}
.niw-button:hover {
background: #5e698f url(niw-btn-gradient-hover.png) repeat-x;
}
.niw-button > .niw-button-contents {
border: 1px solid #73b1da;
}
.niw-button > .niw-button-contents:hover {
border: 1px solid #99a1bc;
}
.niw-button .niw-button-icon {
background-position: center;
background-repeat: no-repeat;
float: right;
height: 25px;
width: 27px;
}
.niw-button .niw-button-text {
height: 25px;
line-height: 1.5em;
padding-left: 5px;
padding-right: 27px;
text-align: center;
text-transform: uppercase;
}
.right-align {
float:right;
}
.niw-icon-cancel {
background-image: url(niwater_cancelIcon.png);
}
</style>
</head>
<body>
<a class="niw-button right-align" href="#">
<div class="niw-button-contents">
<div class="niw-button-icon niw-icon-cancel"></div>
<div class="niw-button-text">Cancel</div>
</div>
</a>
<a class="niw-button" href="#">
<div class="niw-button-contents">
<div class="niw-button-icon niw-icon-cancel"></div>
<div class="niw-button-text">Cancel</div>
</div>
</a>
</body>
</html>