如何在cshtml / razor中将一组控件包装为一个单元？

Question

我的HTML非常生疏。基本上，我得到一个项目列表（来自数据表），并添加单选按钮以及加载的项目文本和用户可供选择的图标。一切都很好，除了我想要单选按钮，附带的文本和图标作为一个组包装。

例如，在有许多选择的小屏幕上，它显示如下：

<O> Item One <icon>  <O> Item Two <icon>  <O> Item Three
<icon>  <O> Item Four <icon>  <O> Item Five <icon>  <O>
Item Six <icon>

但是我想把它包裹在我的小组中，更像是这样：

<O> Item One <icon>  <O> Item Two <icon>
<O> Item Three <icon>  <O> Item Four <icon>
<O> Item Five <icon>  <O> Item Six <icon>

当然，标签尺寸不均匀，我希望休息是动态的，所以如果用户使用的是大型显示器，则所有物品都在1行或2行等等。

所以，问题归结为，是否有一个元素可以包装每个组，在组内关闭包装，并强制包装在组之间发生？

Answer 1

使用CSS样式span将每个组包裹在white-space: nowrap标记中。这会强制同一组中的所有元素保持在同一行，但让浏览器布置组。