html - 如何在css中管理两个不同大小的textarea框

Question

在 css 中我需要两个不同大小的文本框。

我的 Jsfiddle 代码链接是:--- jsfiddle link

但现在我得到了相同的 textarea..我做错了什么？？？

Answer 1

您可以分配两个不同的 ID，然后设置它们的样式:

<div class = "tablebox">   
<form>
<label for="emailaddress">address</label>
<textarea cols="73" rows="12" name="descr" id="texta1"></textarea><br />
<label for="comments">About you </label>
<textarea name="comments" id="texta2"></textarea><br />
</form>
</div>

CSS:

.tablebox 
{

  width: 100%;
  background-color: #F7F7F7;
  margin: 0 auto 10px;
  border-radius: 2px;
  box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);

}

label{
float: left;
width: 100%;
margin-left:10px;
margin-top:10px;
margin-bottom:10px;
font-weight: bold;
}

input{
width: 80%;
margin-bottom: 5px;
}

textarea{
width: 50%;
height: 300px;
}

#texta1{
width: 30%;
height: 300px;
}

#texta2{
width: 70%;
height: 300px;
}