为什么我的HTML元素的大小没有变化(Why is the size of my HTML element not changing)

为什么我的HTML元素的大小没有变化(Why is the size of my HTML element not changing)

我试图改变我的'发送'按钮的大小，但它没有响应。 我知道它应该是一个简单的修复，但我不确定为什么会发生这种情况的确切原因。 我想知道是否有人可以帮助我。 谢谢。

这里是CSS：

.send{ border-radius: 20px; background-color: #00e699; font-weight: bold; color: white; position:relative; width: 80%; height: 80%; top: 50px; left: 32%; }

这是包含“发送”按钮的HTML

<div class="infocard"> <div class = "col-md-12" > <h3 class="theName"></h3> <h3 class="theNum"></h3> <h3 class="theDate"></h3> <input type = "text" name = "Name" size = "30" class = "textBox" ng-model = "input" /> <a href= "" style = "text-decoration: none; color: white;" class = "send" ng-click="passPrompt()">Send Message</a> </div> </div>

I'm trying to change the size of my 'Send' button but it is not responding. I know it should be a simple fix but I'm not sure about the exact reason why this is happening. I was wondering if anyone could help me out. Thanks.

Here is the CSS:

.send{ border-radius: 20px; background-color: #00e699; font-weight: bold; color: white; position:relative; width: 80%; height: 80%; top: 50px; left: 32%; }

Here is the HTML containing the 'send' button

<div class="infocard"> <div class = "col-md-12" > <h3 class="theName"></h3> <h3 class="theNum"></h3> <h3 class="theDate"></h3> <input type = "text" name = "Name" size = "30" class = "textBox" ng-model = "input" /> <a href= "" style = "text-decoration: none; color: white;" class = "send" ng-click="passPrompt()">Send Message</a> </div> </div>

最满意答案

标签display: inline默认为display: inline 。 您需要添加display: block或display: inline以添加宽度/高度样式。

a tags are display: inline by default. You need to add display: block or display: inline to add width/height styles.