如何将以下输入区域扩展到屏幕结束？

Question

这是一种类似Bootstrap的形式：

HTML：

  <div class="container">
    <div class="row">
      <div class="form-group row-group">
        <label class="col-6">First name</label>
        <input class="col-6" type="text" value=""></input>
      </div>
      <div class="form-group row-group">
        <label class="col-6">Last name</label>
        <input class="col-6" type="text" value=""></input>
      </div>
    </div>
    <div class="row">
      <div class="form-group row-group">
        <label class="col-4">Message</label>
        <input class="col-8" type="text" value=""></input>
      </div>
    </div>
    <div class="row">
      <div class="form-group row-group">
        <label class="col-4">Message</label>
        <input class="col-12" type="text" value=""></input>
      </div>
      <div class="form-group row-group">
        <label class="col-4">Message</label>
        <input class="col-12" type="text" value=""></input>
      </div>
      <div class="form-group row-group">
        <label class="col-4">Message</label>
        <input class="col-12" type="text" value=""></input>
      </div>
    </div>
    <div class="row">
      <div class="col-12 row-group">
        <button class="btn">Submit</button>
      </div>
    </div>
  </div>

CSS：

.row {
  display: flex
}

.row-group {
  display: flex
  flex-direction: row !important
  align-items: center

  label {
    flex: 0 0 100px
  }

  input {
    flex: 1
  }
}

.form-group {
  flex: 1 0 0
  flex-direction: column
}

结果如下：

我希望第一行和第三行的输入到达容器div的末尾（不要与其neigbhor水平堆叠）。

我试过了：

.row-group {
  input: flex: 1 1 100%
}

但没有动静。

这样做的正确方法是什么？

Answer 1

请查看这个小提琴 - 这是你想要的吗？ fillna

这是修改后的CSS：

Scanner sc=new Scanner(System.in);
String input=sc.nextLine();
String newstr="";
for(int i=0;i<input.length();i++)
{
char ch=input.charAt(i);
if(Character.isLetter(ch)|| Character.isDigit(ch))
{
newstr=newstr+ch;
}

}
System.out.print(newstr);//string without spaces and special characters

我修复了CSS的一些问题： 1）输入元素后的额外关闭括号 2）.row-group后缺少括号 3）添加'width：100％'属性和'box-sizing：border-box' 4）剩下浮动标签。 5）在.row（不需要）

上注释掉'display：flex'

希望这有帮助。