在HTML中制作可展开按钮

我需要在我的HTML中制作“确定”和“取消”按钮，并且我希望它们是固定宽度，因此两个按钮的大小相同。例如，像这样：在HTML中制作可展开按钮

<style> 
button.ok_cancel { 
    width: 50px; 
    background-color: #4274af; 
    font-size: 9px; 
    line-height: 12px; 
    color: #fff; 
    cursor: pointer; 
    text-transform: uppercase; 
    padding: 1px; 
    border: 0px; 
    margin: 0 0 0 5px; 
    text-align: center; 
    letter-spacing: 1px; 
} 
</style> 

<button class="ok_cancel" onclick="do_cancel()">Cancel</button>

但现在我本地化的文本和翻译为“取消”可太宽的按钮。如果字符串适合，我希望按钮的固定宽度为50像素，但如果字符串更宽，则按钮的宽度要扩大。固定数量的边填充将用于保持按钮看起来不错。

我知道我可能不能用纯CSS做到这一点，但最简单的HTML我可以使用它会给我我想要的效果？

来源

2008-12-09 Ned Batchelder

我从twodayslate的答案工作，并结束了与此：

/* Browser hack! This is for everyone: */ 
button { 
    display: inline; 
    cursor: pointer; 
    padding: 6px 6px; 
    width: 50px; 
    overflow: visible; 
} 
/* and this is for non-IE browsers: */ 
html>body button { 
    min-width: 50px; 
    width: auto; 
}

IE想要一个指定的宽度和溢出可见，其他浏览器需要一个最小宽度和宽度自动。 CSS黑客让IE看到一组属性，另一个浏览器看到另一组属性。

来源

2008-12-10 01:20:12

不知道，但：

按钮{最小宽度：50像素;宽度：自动; }

LMK如果工作，它应该工作，只要它不浮动。

来源

2008-12-09 02:15:53 twodayslate

它在Firefox中看起来不错，但IE6忽略最小宽度属性。 – 2008-12-09 02:33:00

您通常可以为IE设置*宽度和溢出：自动或显示，IE将正常扩展。 – 2008-12-09 06:20:50

在HTML中制作可展开按钮

回答

相关问题