我正在尝试创建一个带有水平方向的复选框的表单，可以向左/向右滚动，同时保持每个复选框的样式看起来像一个按钮。 （如图here）
不幸的是，复选框继续包装到下一行，我无法弄清楚原因。
这是我的代码： http://jsfiddle.net/markocalvocruz/55jp59ho/
我使用这个网站作为参考：
https://www.w3schools.com/howto/tryit.asp?filename=tryhow_css_menu_hor_scroll
上面的链接带有标签列表，如图所示。我的猜测是将display: inline-box应用于<label>标记时出现问题。我尝试用<label>替换<span>，但后来我无法按照我的要求查看复选框（并且它也无法解决问题）。
答案 0 :(得分：1)
用.ck-button将所有id="container" div包裹在另一个div下，然后添加以下css
#container{
width:2000px;
}
并为您的按钮执行以下操作：
.dates form .ck-button label{
width:100%;
height:100%;
}
.dates .ck-button input:checked + span{
width:100%;
height:100%;
}