html - 我正在使用 flexbox 来显示标签和输入字段。我如何让它响应？

Question

我必须使用 flex 类将标签和输入字段制作成一行。我如何强制它响应？

我的 HTML 代码是

.container{
  width:1100px;
  margin:0 auto;
}

.form_single_wrap{
  display:flex;
  flex-wrap: wrap;
}
.form_single_wrap label{
  width:10%;
}
.form_single_wrap input{
  width:80%;
}
            

<div class="container"> 
  <div class="form_wrap"> 
    <form action=" ">
      <div class="form_single_wrap"> 
        <label for="name">Name</label>
        <input type="text" name="name" placeholder="Name"/>
      </div>
      <div class="form_single_wrap"> 
        <label for="email">Email Send Us</label>
        <input type="text" name="email" placeholder="Email"/>
      </div>
    </form>
  </div> 
</div>

如何让它响应？

可以在codepan中看到

Answer 1

容器使用 % 而不是 px :)

.container{
 width:100%;
 margin:0 auto;
 }