按钮文字漂浮在按钮外

我有几个按钮，其中的文字是按钮的一半和一半。它不会延伸到按钮的右侧，因为它太长。只需按下按钮的底部水平边框即可将其切成两半。按钮文字漂浮在按钮外

作为新手，我只是把厨房的水槽放在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

按钮文字漂浮在按钮外

回答

相关问题