复选框列表垂直给出结果

Question

我正在尝试制作一个复选框列表，为此我使用了此语句
<?php echo CHtml::checkBoxList('interests', '', array('PHP', 'MySQL', 'JavaScript', 'CSS', 'Yii Framework')); ?>

但它给了我其中名称（"PHP"，"MySQL"，"JavaScript"，"CSS"，'Yii 框架'）指定复选框位于框下方，而我希望名称水平与它们在一起。

Answer 1

解决问题的简单方法是您可以在复选框列表中定义输入复选框的样式，例如：

#interests input {
    float: left;
    margin-right: 10px;
}

您的输入（复选框）和标签将是水平的。

Answer 2

你不需要自定义CSS来做到这一点。Yii 内置了一个名为"分隔符"的属性。您可以通过这样做轻松摆脱换行符：

echo CHtml::checkBoxList('...','...', array(...),
  array(
    'separator'=>'', //the default was a line break...
    )
);

Answer 3

好的 - 我让它工作了。这是我使用的。分隔符将删除行之间的间距，浮点数实现与描述在同一行上的框。

.checkBoxClass
{
	float: left;
}

<div id="itemGroups" class="itemGroups">
	<?php echo $form->checkBoxList($model, 'groups', $group_items,  
		array(
			'separator' => '',
			'class'=>'checkBoxClass',
		)
	);?>
</div>

Answer 4

echo CHtml::checkBoxList(
    'interests', 
    '', 
    array('PHP', 'MySQL', 'JavaScript', 'CSS', 'Yii Framework'), 
    array('labelOptions' => 
           array(
                 'style' => "display: inline-block"
           )
    )
); 

或者最好在CSS文件中指定一些类

.mylabelclass {
 display: inline-block
}

和使用

array('labelOptions' => 
       array(
               'class' => "mylabelclass"
       )
)