html - 无法更改文本区域的宽度

Question

我无法使用 html 行和列更改 textarea 的宽度，也无法使用 css 宽度更改它。我已经用html改变了高度。

如何改变宽度？

form,
label {
  position: relative;
  width: 310px;
  margin-left: 65px;
}

input,
textarea {
  border-radius: 4px;
  line-height: 30px;
  flex: 0 0 200px;
  margin-left: 10px;
  height: 35px;
}

label,
input,
textarea {
  display: block;
  margin-top: 20px;
  margin-right: -300px;
}

form {
  margin-top: 100px;
  margin-left: 580px;
  display: block;
  margin-top: 20px;
}

<div class="text-area"><label class="l-message">Message * <textarea name="message" type="textarea" class="message" style="height: 105px;" required></textarea></label></div>

Answer 1

您可以通过多种方式更改宽度。您可以内联或在 CSS 中执行此操作。 CSS 是推荐的方法。请看下面的片段

    form, label {
    position: relative;
    width: 310px;
    margin-left: 65px;
    }

    input, textarea {
    border-radius: 4px;
    line-height: 30px;
    flex: 0 0 200px;
    margin-left: 10px;
    height: 35px;
    width: 100%; /* or whatever width you want to set */
    }
    .form-area {
    background-color: #FAFAFA;
    padding: 0px 0px 40px;
    margin: 30px 265px 0px;
    border: 1px solid GREY;
    border-radius: 6px;
    width: 710px;
    height: 360px;
    }

label, input, textarea {
    display: block;
    margin-top: 20px;
    margin-right: -300px;
}
form {
margin-top: 100px;
margin-left: 580px;
display: block;
margin-top: 20px;
}

<div class="text-area"><label class="l-message">Message * <textarea name="message" type="textarea" class="message" style="height: 105px;" required></textarea></label></div>