如何更改整个部门的文本框大小？

Question

我试图让整个部门的盒子更小并彼此相邻，以形成“盒子-盒子-盒子”的形式，但我不确定如何处理它。我知道如何通过单独编码每个文本来做到这一点，但我想知道是否有更快的方法。任何帮助将不胜感激。

<div class="name">
  <label class="yyyy"></label>
  <input type="text" class="year" id="Project Name" placeholder="YYYY"> _
  <label class="sitee"></label>
  <input type="text" class="site" placeholder="Site" id="Project Name"> _
  <label class="GG"></label><input type="text" class="gg" id="Project Name" placeholder="GG"> _
  <label class="projectn"></label><input type="text" class="pn" id="Project Name" placeholder="Project Name"> _
  <label class="amountt"></label>
  <input type="text" class="amount" id="Project Name" placeholder="Amount"> _
  <label class=money></label>
  <input type="text" class="CCC" id="Project Name" placeholder="CCC">
</div>

Answer 1

只要给他们一个宽度

同时将标签环绕输入并删除空格，然后我们可以使用 ::before 在除最后一个

之外的所有内容上添加下划线

.name input { width:45px }

.name label+label::before { content: "_" }

<div class="name">
  <label class="yyyy"><input type="text" class="year" id="Project Name" placeholder="YYYY"></label><label 
  class="sitee"><input type="text" class="site" placeholder="Site" id="Project Name"></label><label 
  class="GG"><input type="text" class="gg" id="Project Name" placeholder="GG"></label><label 
  class="projectn"><input type="text" class="pn" id="Project Name" placeholder="Project Name"></label><label 
  class="amountt"><input type="text" class="amount" id="Project Name" placeholder="Amount"></label><label 
  class=money><input type="text" class="CCC" id="Project Name" placeholder="CCC"></label>
</div>

如何更改整个部门的文本框大小？

How can I change the text boxes size in an entire division?

html

javascript

css

text

styles