0

我对仅在 IE 7 或更低版本中合并到列表元素中的一组按钮有疑问。所以所有按钮都出现Title 2在第二个 li 元素中。请参阅下面的 html 和 css

<ul class="tabs">
   <li><a href="#tab1">Title 1</a></li>
   <li><a href="#tab2">Title 2</a></li>
   <span class="button-span">
   <button id="print" title="Print">
   <img alt="Print" src="images/ico-print.png" border="0"/>
   </button>
   <button id="save" title="Save">
   <img alt="Save" src="images/word.gif"/>
   </button>
   </span>
</ul>

CSS

ul.tabs li {
    background: url('../images/gradient-black.png') repeat-x top left #262626;
    border-top: 1px solid #444;
    border-left: 1px solid #535250;
    border-right: 1px solid #535250;
    -webkit-border-top-left-radius: 6px;
    -moz-border-top-left-radius: 6px;
    border-top-left-radius: 6px;
    -webkit-border-top-right-radius: 6px;
    -moz-border-top-right-radius: 6px;
    border-top-right-radius: 6px;
    cursor: pointer;
    float: left;
    margin: 0 5px 0 0;
    padding: 6px 20px;
    overflow: hidden;
    text-align: center;
    width: 200px;
}

span.button-span {
    margin-right: 35px;
    float: right;
    clear: both;
}
4

2 回答 2

0

你应该看看这个：http://stackoverflow.com/questions/1903453/what-disadvantages-are-there-to-the-button-tag-it-seems-there-are-quite-a-fe一个线索，为什么它不能正常工作，你还需要像@da5id 说的那样关闭你的跨度标签

于 2012-12-12T19:50:12.553 回答
0

固定示例： http: //jsfiddle.net/xQ4L9/1/（使用 URL http://jsfiddle.net/xQ4L9/1/show/在 IE7 中查看结果）

修复步骤：

  1. 移出button-span并ul使其成为块元素。
  2. 将相应的 CSS 选择器从 更改span.button-span为.button-span
  3. 删除. clear:both_.button-span
于 2012-12-12T20:41:54.027 回答