0

我有以下代码，其中包含 3 个按钮：

<div id="button-panel">
    <form action="../edit/" method="GET">
     <input type="hidden" name="id" value="<?php echo $record->id; ?>" />
     <input type="submit" value="Edit" />
    </form>

    <form action="" method="POST">
     <input  type="submit" name="cancel_btn" value="Cancel" />
    </form> 

  <input type="button" id="boh-url-gen" value="Generate URL" onClick="generateURL();" />                    
</div>  <!-- button-panel -->

尽管我努力，按钮在 IE7 中垂直对齐。目前我应用了以下CSS：

#button-panel *{display:inline-block;}

但是，它不适用于 IE7。

4

2 回答 2

0

这仅仅是因为display:inline-blockIE7 不完全支持。参考这里。

如果您想要完全支持，只需浮动元素。

#button-panel {
    float:left; /* right */
}

请注意，浮动元素会将其从流程中移除，因此您可能需要向父级添加类似的内容 - 假设内容正在折叠，因为未设置overflow:auto固定height/ 。width

于 2013-10-20T02:49:59.107 回答
0

IE7 不支持默认display:inline-block元素。block

相反，display:inline让他们表现得像inline-block（IE7太奇怪了）

因此，您可以使用条件注释为 IE7 或 IE7 CSS hacks 创建样式表，使用display:inline. 例如：

*:first-child+html #button-panel { /* IE7 hack which is valid CSS */
    display: inline;
}

（来自Alohci这个答案的IE7 破解）

于 2013-10-20T02:52:58.463 回答