使链接具有相同的宽度

Question

我有按钮根据按钮内的文字改变宽度。如何使它们的宽度相同？ 我已经尝试编辑css并添加 min-width:100px and width:100px;但它不起作用。

a {
  min-height: 0px;
  min-width: 0px;
  line-height: 45px;
  border-width: 0px;
  margin: 0px;
  padding: 6px 13px 5px;
  letter-spacing: -1px;
  font-size: 20px;
}
div {
  z-index: 7;
  white-space: nowrap;
  min-height: 0px;
  min-width: 0px;
  line-height: 38px;
  border-width: 0px;
  margin: 0px;
  padding: 0px;
  letter-spacing: 0px;
  font-size: 24px;
  left: 1148px;
  top: 425px;
  visibility: visible;
  opacity: 1;
  transform: matrix3d(1, 0, 0, 0, 0, 1, 0, 0, 0, 0, 1, -0.0025, 0, 0, 0, 1);
}

<a href="#" class="tp-button red small">MIT</a>

<div class="tp-caption noshadow tp-fade tp-resizeme start" data-x="center" data-hoffset="200" data-y="bottom" data-voffset="-50" data-speed="300" data-start="500" data-easing="Power3.easeInOut" data-splitin="none" data-splitout="none" data-elementdelay="0.1"
data-endelementdelay="0.1" data-endspeed="300"><a href="#" class="tp-button red small">Brandies</a>

Answer 1

默认情况下链接为inline。只需将它们设置为inline-block，即可应用宽度。

a.tp-button {
  display: inline-block;
}