更新#2:除了一个主要问题，我几乎解决了所有问题。使用相同的结构和 CSS IE7/6 显示每个 a 及其容器的 100% 宽度。我需要这一切不会发生。除此之外，其他一切都很好。谁能赐教一下？
更新:应该看起来像这样
我有以下 html 页面(详见下文)。它只是从链接中呈现 2 个样式按钮。我的问题是 IE6 和 7 呈现它的方式不同于 Firefox、Safari、IE8 和 Chrome，它们都可以正确呈现它。
为了让它在 IE6/7 中工作，我已经用头撞墙一天了。谁能就我做错了什么提供建议？
谢谢
<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>
最佳答案
编辑:现在我理解了你的形象:
只需制作您的 <a> elements 使用 display:block block 元素，并在其中放置某种 span 以容纳图标。或者你可以把整个事情变成一个图像......
关于html - 跨浏览器使用 CSS 样式化链接按钮，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/681368/