0

我正在尝试创建一个带有多个复选框的表单。复选框是从数据库动态创建的，但它们总是在新行中创建，而我希望它们并排对齐。我是 CSS 和 php/mysql 的新手，所以我无法正确处理。你能帮我吗？ 

$mysqli = new mysqli('localhost', 'mechuser', 'mypassword', 'mechug_lab');

$query = "SELECT * FROM slots WHERE lab_id = '530_335' AND slot_status = '0' AND expt_id='3'";
$result=mysql_query($query);

if($result) {
                if(mysql_num_rows($result) != 0) {
                    $date = "0000-00-00";
                    while($row = mysql_fetch_array($result)):
                    ?>
                    <div><label><?php
                    $date1 = $row['date'];
                    $weekday = date('D', strtotime($date1));
                    $today = date('M j, Y',strtotime($date1));
                    if ($date1 != $date)
                        echo "<strong>".$today."   ".$weekday."</strong> &nbsp";
                        echo " ".$row['slot_time'];
                        $date = $date1;
                    ?>
                    <input type="checkbox" name="bookings[]" value="1"></label></div><?php endwhile;
                    }
                    }
                    ?>

4

4 回答 4

1

复选框周围的 div 是块级元素（生成新行），您可能想要使用 span （这是一个内联级元素）或者制作内联/内联块元素或浮动它们，选择是你的 :)

style="display:inline"或style="display:inline-block"或<span>代替<div>

于 2013-08-29T17:36:55.653 回答
1

向您的 div 添加一个类，或者如果有父级，则将其作为特定目标。

在您的 CSS 中使用：

div.yourclass {
   display:inline-block
}

示例：http: //jsfiddle.net/pveez/

Usingdisplay:inline-block允许您保留包装在 a 中的好处div（假设您这样做是有原因的），同时让元素显示为内联或彼此相邻的“浮动”。

避免像其他答案建议的那样使用内联样式。

于 2013-08-29T17:39:55.387 回答
0

添加样式=“浮动：左”；给他们

<div style="float:left;">

还有其他方法，比如把它们放在桌子上。或者只是添加它们class=""，然后让设计人员按照他想要的方式对其进行格式化。

于 2013-08-29T17:37:24.373 回答
0

display:inline-block将宽度设置为 100/count %的 div 。使用 4 个复选框，您可以将它们与width:25%.

于 2020-02-26T09:04:23.320 回答