使用滑动门技术帮助设置 asp:button 控件的样式答案

【问题标题】：help styling the asp:button control using the Sliding Door technique使用滑动门技术帮助设置 asp:button 控件的样式
【发布时间】：2010-07-23 16:31:52
【问题描述】：

由于我们在使用 asp.net 时遇到了一个问题（请参阅：asp.net 4.0 Random posting behavior），我们需要使用滑动门技术来设置 asp:button 控件的样式（当然会解析为标签）。

我们最初有集，但由于上述问题，我们需要转移到 asp:Button 控件。

您不能在 asp:button 控件中放置标签，因此无法像上面那样工作。

我通过使用“display：inline-block”将按钮与 div 包装在一起，使其只能在 IE8 中工作。但它在 IE7 中失败，所以这不是我们的解决方案。它需要在 IE7 和 IE8 中工作（Firefox 会很棒，但不是必需的）

【问题讨论】：

您能否描述一下您期望使用“滑动门”技术的行为？
"... 如果我们使用两个单独的背景图像，可以创建灵活的界面组件，可以根据文本的大小扩展和收缩。一个用于左侧，一个用于右侧。想想这两个图像作为完成一个门口的滑动门。门滑动在一起并重叠更多以填充狭窄的空间，或者滑动分开并减少重叠以填充更宽的空间......“可以找到一个很好的定义@alistapart.com/articles/slidingdoors虽然，他们正在创建选项卡，该概念适用于任何交互式动态元素 - 例如按钮

标签： asp.net css

【解决方案1】：

要为 IE6-7 修复 display: inline-block;，您可以尝试

<div class="button"><input type="submit" /></div>


.button {
   display: inline;
   display: inline-block;
   zoom: 1;
}

（这些样式几乎适用于您想要在所有浏览器中模拟内联块的任何时间）

【讨论】：

谢谢，但如上述问题所述，我不能使用的 asp:Button 控件
好的，你可以用 inline-block 元素包装你的输入。它没有变化。检查编辑的答案
对，这正是我所说的，我在原文中尝试过，但在 IE7 中失败 - 请重新阅读原始问题
...“我让它只能在 IE8 中工作，方法是使用“display: inline-block”将按钮包裹在一个 div 中。”... 是的，但如果你要添加 @987654323 @display: inline-block; 和 zoom: 1; 之前的 @ - 这将解决 IE7 的内联块问题 - 它们将正常工作。试试看吧。
我很抱歉 - 我要到星期一才能测试这个。但我会在早上第一件事对其进行测试。我真的希望这有效