在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中製作可展開按鈕

回答

相關問題