按钮文本浮动在按钮之外

时间:2017-02-18 19:53:54

标签: css

我有几个按钮,文本是按钮的一半和一半。它没有延伸到按钮的右侧,因为它太长了。它只是由按钮的底部水平边框切成两半。

对此我不熟悉我只是在按钮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;

2 个答案:

答案 0 :(得分:1)

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;

无需指定宽度或高度,因为它会剪切文本

答案 1 :(得分:0)

<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