我有一些按钮应该看起来都一样。
1 个包含“Anmäl”一词，另一个包含“信息”。这导致较长单词的按钮更大，我不想要那个！
即使单词的长度不同，我也希望按钮看起来相同。
我正在使用填充使它们更大，我尝试了“宽度”但它不起作用。
任何帮助表示赞赏！
CSS：
.startLink {
padding: 20px;
padding-left: 90px;
padding-right: 90px;
color: white;
background: #8d68dc;
border-radius: 5px;
font-size: 16px;
box-shadow: 0px 5px 10px #000;
webkit-transition: all 200ms ease-in;
-moz-transition: all 200ms ease-in;
-o-transition: all 200ms ease-in;
-ms-transition: all 200ms ease-in;
transition: all 200ms ease-in;;
}
HTML：
<a href="index.php?anmal" class="startLink">Anmäl</a>
<a href="index.php?info" class="startLink">Information</a>
width 是答案，但它对您不起作用，因为这些链接当前是内联元素，无法接收显式宽度。
给他们inline-block或block他们的display财产，然后您可以使用width.
至于让它们具有相同的宽度，只需使宽度可以舒适地容纳两者即可。例如，这里是您如何将段落中的按钮居中，每个按钮的宽度相同。
HTML
<p id='btns'>
<a href="index.php?anmal" class="startLink">Anmäl</a>
<a href="index.php?info" class="startLink">Information</a>
</p>
CSS
#btns { text-align: center; }
.startLink {
display: inline-block;
margin: 0 .65rem;
background: red;
padding: 1em;
min-width: 200px;
}
最好使用min-width而不是width这样，以防万一按钮文本（在现实世界中，可能来自数据库或其他动态源）超过按钮的宽度允许的长度，它会安全地扩展以适应它（即使这意味着您的按钮不再具有相同的宽度。）
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句