0

我正在尝试在按钮标签中设置 2 个 div 的样式(1 个 div 将包含一个图标和另一个描述性文本,请注意我无法更改 html 标签)。
在 IE7 中,一个 div 中的 2 个 div 并排放置,而按钮标签中的相同 2 个 div 位于另一个下方 1。
是否有特定的按钮标签可以将潜水 1 安排在彼此下方,并且可以被任何 IE7 hack 或 css 技巧覆盖吗?

<!DOCTYPE html>
<html>
<head>
    <style>
        button {
            display:block;
            float:left;
            clear:none;
        }
        .div1 {
            border:1px solid red;float:left;
        }
        .div2 {
            border:1px solid red;float:left;
        }
        .div3 {
            border:1px solid cyan;float:left;
        }
    </style>
</head>
<body>
<button><div class="div1">div1</div><div class="div2">div2</div></button>
<div class="div3"><div class="div1">div1</div><div class="div2">div2</div></div>
</body>
</html>
4

2 回答 2

2

在 IE7 中尝试这个宽度是强制性的

          button {

        float:left;
        clear:none;
        width:80px;
    }
        .div1 {
            border:1px solid red;float:left;
        }
        .div2 {
            border:1px solid red;float:left;
        }
        .div3 {
            border:1px solid cyan;float:left;
        }
于 2013-07-01T13:02:30.597 回答
0

如果你不想给按钮一个宽度,这是尽可能接近的。

<!DOCTYPE html>
<html>
 <head>
  <style>
   button {
    /* no styles */
   }
   .div1 {
    display:inline;
    border:1px solid red;
   }
   .div2 {
    display:inline;
    border:1px solid red;
   }
   .div3 {
    display:inline;
    border:1px solid cyan;
   }
  </style>
 </head>
 <body>
  <button><div class="div1">div1</div><div class="div2">div2</div></button>
  <div class="div3"><div class="div1">div1</div><div class="div2">div2</div></div>
 </body>
</html>

现在这远非理想,我可以看到,但也许它会给你一些开始。

于 2013-07-01T13:25:24.093 回答