Question

我正在尝试获取一个复选框列表，以便在整个页面上显示而不是垂直显示我在SO和其他人看过很多帖子，看起来我做的是正确的，但我的复选框拒绝水平浮动。我尝试了许多解决方案，包括内联样式和在代码中分配不同的类。有人可以发现我的错误吗？

蛋糕代码

<?php
    echo $this->Form->input('Check.Assessment', array(   'multiple' => 'checkbox')); // checkboxes
?>

生成的HTML

<div class='assessments'>
<div class="input select"><label for="CheckAssessment">Assessment</label><input type="hidden" name="data[Check][Assessment]" value="" id="CheckAssessment"/>

<div class="checkbox"><input type="checkbox" name="data[Check][Assessment][]" value="1" id="CheckAssessment1" /><label for="CheckAssessment1">Blah</label></div>
<div class="checkbox"><input type="checkbox" name="data[Check][Assessment][]" value="2" id="CheckAssessment2" /><label for="CheckAssessment2">Blah Blah</label></div>
<div class="checkbox"><input type="checkbox" name="data[Check][Assessment][]" value="3" id="CheckAssessment3" /><label for="CheckAssessment3">Blah Blah Blah</label></div>
<div class="checkbox"><input type="checkbox" name="data[Check][Assessment][]" value="4" id="CheckAssessment4" /><label for="CheckAssessment4">Blah Blah Blah Blah</label></div>
</div>

的 CSS

.checkbox
{
float: left;
padding-right: 15px;
}

Answer 1

我为你修好了一个很好的演示小提琴 https://jsfiddle.net/wgrLfxg3/15/

刚刚修好了css display：box

.checkbox
{

padding-right: 15px;
    display:box;
}

如果你想要div之间的保证金，只需添加

padding-bottom:10px

或类似的东西。

如果你想让它们向左浮动，只需设置

即可

left:0;

编辑：

如果你需要的是让它们内联只需添加display：inline-block，这里是这个的演示

https://jsfiddle.net/wgrLfxg3/19/

Cakephp水平复选框

1 个答案: