2

textarea我根据我的布局的其余部分搜索了一种调整 a 大小的方法,并偶然发现了 box-sizing 方法。我可能没有正确使用它,因为它对我不起作用。我有一个显示 3 个不同行的布局。中间行应该显示一个文本输入字段,下面是所有最近的帖子。现在我希望与textarea其他帖子的宽度相同。

HTML

<div class="row">
  <div class="col-sm-2">
    <!-- Empty Space -->
  </div>
  <div class="col-sm-2">
    Some text here
  </div>
  <div class="col-sm-4">
    <textarea placeholder="Text here"></textarea>
    <div class="well"> Posts ...</div>
  </div>
  <div class="col-sm-2">
    Some text here
  </div>
  <div class="col-sm-2">
    <!-- Empty Space -->
  </div>
</div>

和CSS

textarea{
  box-sizing: border-box;
  border-radius: 5px;
  resize: none;
}
4

3 回答 3

2

您可能正在寻找

textarea {
  width: 100%;
}

您的帖子将自动占用列中的所有空间,因为divs 是块级元素。见我的小提琴

附带说明一下,box-sizing属性只定义了指定的宽度/高度和计算的宽度/高度之间的关系。

于 2018-02-05T14:44:55.163 回答
0
textarea {
  outline: none;
}

那应该删除发光女巫调整您的文本区域的大小。

于 2020-10-26T19:47:28.963 回答
0

您可以将属性宽度添加到textareacss

像这样:

width:100px; // you can change it to whatever width you want

textarea{
    box-sizing: border-box;
    border-radius: 5px;
    resize: none;
    width:100px; /* set you own width */

}
<div class="row">
        <div class="col-sm-2">
            <!-- Empty Space -->
        </div>
        <div class="col-sm-2">
            Some text here
        </div>
        <div class="col-sm-4">

            <textarea placeholder="Text here"></textarea> 
           <div class="well"> Posts ...</div>



        </div>
         <div class="col-sm-2">
            Some text here
        </div>
        <div class="col-sm-2">
            <!-- Empty Space -->
        </div>
</div>

于 2018-02-05T14:28:55.650 回答