使按钮大小与CSS相同

时间:2017-11-05 07:10:47

标签: css html5

我试图通过CSS使按钮大小相同,但是当文本缺少几个字母时,大小就会被丢弃

CSS:

  .btc {
    font-family: 'Open Sans', sans-serif;
    padding: 0.75em 2em;
    text-align: center;
    text-decoration: none;
    text-indent: 500px;
    color: #FFAA48;
    border: 2px solid #FFAA48;
    font-size: 24px;
    display: inline;
    border-radius: 0.3em;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    position: relative;
    overflow: hidden;
    background-image: url(https://bitcoin.org/img/icons/opengraph.png);
    background-repeat: no-repeat;
    background-position: center left 11px;
    background-size: 30px 30px;
  }
  .btc:hover {
    font-family: 'Open Sans', sans-serif;
    background-color: #FFAA48;
    color: #fff;
    border-bottom: 4px solid #FFAA48;
  }

1 个答案:

答案 0 :(得分:2)

试试这段代码:

 .btc {
    font-family: 'Open Sans', sans-serif;
    padding: 0.75em 2em;
    text-align: center;
    text-decoration: none;
    text-indent: 500px;
    color: #FFAA48;
    border: 2px solid #FFAA48;
    font-size: 24px;
    display: inline;
    border-radius: 0.3em;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    position: relative;
    overflow: hidden;
    background-image: url(https://bitcoin.org/img/icons/opengraph.png);
    background-repeat: no-repeat;
    background-position: center left 11px;
    background-size: 30px 30px;
    width: 100%;
  }
  .btc:hover {
    font-family: 'Open Sans', sans-serif;
    background-color: #FFAA48;
    color: #fff;
    border-bottom: 4px solid #FFAA48;
  }