css - 为什么我在 IE 上出现按钮拉伸(stretch)宽度问题？

Question

我的登录页面上有一个按钮，该按钮在所有 IE 浏览器版本中都会拉伸(stretch)。

请在此处查看我的实时网站黑色“登录”按钮: www.urbanclaim.com

这是我用于此按钮的代码:(查看表单结构的源代码)

<input style="margin-left:15px;"  type="submit" name="Submit" class="button" value="<?php echo JText::_('LOGIN') ?>" />

我如何在 ie 上解决这个问题？？谢谢。

Answer 1

您的按钮在 IE8/9 中可以正常工作，但您有这个:

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" />

这会强制这些浏览器模拟 IE7，这是唯一实际存在按钮问题的版本。

要修复 IE7(以及 IE7 模式下的其他版本的 IE..):

• 在 .art-button-wrapper 的父级 label 上，将 margin-left: 300px 更改为 padding -左:300px。同时添加 display: block。对下一个 label 进行相同的更改。

在 IE7 中查看: http://jsbin.com/akavef/3

<!--
<label style="margin-left:300px;font-weight: bold; ">
-->
<label style="padding-left:300px;font-weight: bold; display:block ">