html如何定义包装块,尽管块中有空格，为什么在连续的块之间发生包装？ - html代码

问题

Say you want to create a form with labels for your input, and want to make it somehow responsive by displaying as many inputs along with their labels on each line. In order to do this, I thought about the automatic space wrapping : no space between labels and inputs, but space between each group.

As you can see, there is a space between each "group" of label+input due to the line break. But that does not seem to be OK for automatic wrapping as is seems wrapping is done between inputs and labels almost always. What I want is to wrap at the space, not between the label and the input!

What am I doing wrong ? Although I know wrapping each group in another item would work, I'd like to keep my code as light as possible. I tried some CSS, but did not manage to arrange this.

Thanks in advance for your help!

解决方法

Actually, this can be achieved by wrapping the input tags inside the labels and adding a CSS rule to labels :

label{

white-space:nowrap;

}