为什么我的 CSS 没有改变提交按钮的高度？

Question

为什么我的 CSS 没有改变提交按钮的高度？宽度改变但高度没有。我也试过使用填充，但它也没有改变。

这是我的代码：-

.contact-form input[type="submit"] {
  width: 100%;
  height: 65px;
}

<form class="contact-form" action="">
  <input type="text" name="fullname" placeholder="full name">
  <input type="text" name="email" placeholder="email address">
  <input type="text" name="subject" placeholder="subject">
  <textarea name="message" placeholder="message"></textarea>
  <input type="submit" value="Submit">
</form>

https://i.stack.imgur.com/DpdQK.png

谢谢

Answer 1

You have to use padding in your submit button in order to size it. I put an example below.

input[type=submit] {
  width: 100%;
    background-color: #4CAF50;
    color: white;
    padding: 40px 20px;
    border: none;
}

<form class="contact-form" action="">
  <input type="text" name="fullname" placeholder="full name">
  <input type="text" name="email" placeholder="email address">
  <input type="text" name="subject" placeholder="subject">
  <textarea name="message" placeholder="message"></textarea>
  <input type="submit" value="Submit">
</form>