按鈕文字漂浮在按鈕外

我有幾個按鈕，其中的文字是按鈕的一半和一半。它不會延伸到按鈕的右側，因爲它太長。只需按下按鈕的底部水平邊框即可將其切成兩半。按鈕文字漂浮在按鈕外

作爲新手，我只是把廚房的水槽放在css按鈕上，卻沒有真正知道它會做什麼。任何幫助讚賞。

color:yellow; 
background-color:aquamarine; 
height: 20px; 
width: 100px; 
border:none 0px transparent; 
font-size: 1px; 
float:right; 
overflow:visible; 
vertical-align:text-top; 
text-align:center; 
padding-top:65px; 
text-overflow: ellipsis;

來源

2017-02-18 Neddie

你有沒有嘗試刪除你設置的高度和寬度的CSS屬性？你不一定需要這樣做。讓文本確定按鈕的寬度 –

感謝您的答覆。我刪除了它們，現在文本在按鈕中，但按鈕太大了。我試着讓文本變得更小，但即使我將XX小文字放在按鈕底部。我似乎不能垂直居中。 – Neddie

您的填充頁面可能對此負責。墊頂添加到按鈕的默認高度 –

color:yellow; 
background-color:aquamarine; 
border:none 0px transparent; 
font-size: 1px; 
float:right; 
overflow:visible; 
vertical-align:text-top; 
text-align:center; 
padding-top:65px; 
text-overflow: ellipsis;

無需指定寬度或高度，因爲它會剪切文本

來源

2017-02-18 20:09:59 Pulkit

<body> 
    <button id="btn"> 
    THIS IS A TEXT 
    </button> 
</body>

的CSS使用這種

#btn { 
    color:black; 
    background-color:aquamarine; 
    /*height: 20px; 
    width: 100px;*/ 
    border:none 0px transparent; 
    /*font-size: 1px;*/ 
    float:right; 
    overflow:visible; 
    vertical-align:text-top; 
    text-align:center; 
    padding: 10px; 
    /*padding-top:65px;*/ 
    text-overflow: ellipsis; 
}

你可以只單獨使用padding財產，這增加了文本的四個方向。 font-size太小了。

看看here。

來源

2017-02-18 21:09:10

謝謝。但如果我不包括高度和寬度限制，按鈕變得太大。 – Neddie

大於https://jsfiddle.net/1wqw358g/1/ –

謝謝。我通過不使用高度和寬度而是使用填充對它進行了排序。謝謝你的幫助。 – Neddie

按鈕文字漂浮在按鈕外

回答

相關問題