1

我正在尝试制作一个带有 2 行文本的大按钮,如下所示:

我想要的是

这是我当前的JSFiddle,展示了我“完成”的内容

我对 asp.net 和一般编程还很陌生,所以请原谅我糟糕的 CSS。

感谢任何人都可以提供的任何帮助。

的HTML:

<div class="bigGreenButton"> <a href="/Liquor/specialorder/supplier-info">Submit a special order request <br />
for information ➧
</a> </div>

CSS:

.bigGreenButton a{
font-family:'TradeGothic LT CondEighteen';
font-size:18px;
background-color:#60a74a;
color:white;
font-weight:bold;
padding-bottom:10px;
padding-top:10px;
padding-left:25px;
padding-right:25px;
text-transform:uppercase;
text-decoration:none;
height:auto;
width:auto;
text-align:center;
}

.bigGreenButton a:hover {
 background-color:#cccccc;
}

button {
text-align: center;
padding: 0px 0px 0px 0px;
border: none;
}
4

2 回答 2

0

将此添加到您的CSS:

.bigGreenButton a{
    display: inline-block;
    ...
}

你可以在这里看到它。

于 2013-08-08T21:56:47.717 回答
0

更改显示,因为您的链接内没有块并设置您想要的宽度。

.bigGreenButton a{
    ...
    display: block;
    width: 400px;
}

显示在这里

于 2013-08-08T21:57:32.940 回答