您好,我正在尝试为我的表格设置固定宽度。
我的问题是浏览器(chrome)忽略了我设置的宽度。
我的代码:
<div class="class_table"><table border="1" id="classes_list">
**MY TABLE CODE**
</table></div>
CSS
.class_table
{
font-size: 20px;
margin-top:35px;
margin-left: 25px;
position:absolute;
width:15px;
table-layout: fixed;
}
编辑:
这是我现在与图像一起使用的代码,以表明它不起作用。
HTML:
<head>
<?php
require_once('calssesHelper.php');
session_start();
$classesHelper = new ClassesHelper();
echo $classesHelper->getClasses($_SESSION['gym']);
?>
</head>
PHP:
echo '<div class="class_table"><table border="1" id="classes_list">';
echo '<tr>
<th>Class id</th>
<th>Name</th>
<th>Date</th>
<th>Teacher</th>
<th>Place</th>
<th>Message</th>
<th>Users</th>
</tr>';
$count = 0;
while ($stmt->fetch())
{
if ($count % 2 == 0)
echo '<tr class="row_color_one_class" id="'.$id.'"><td>'.$id.'</td><td>'.$name.'</td><td>'.$date." ".$time.'</td><td>'.$teacher.'</td><td>'.$place.'</td><td>'.$message.'</td><td>'.$this->countUsersInClass($id)."/".$max_user.'</td>
<td><button type="button" id="'.$id.'" onclick="removeClass(this.parentNode.parentNode, \''.$gym.'\')" style="cursor: pointer;"><img src="images/program/trash_small.png"></button></td>
<td><button type="button" id="'.$id.'" onclick="editClass(this.parentNode.parentNode)" style="cursor: pointer;"><img src="images/program/edit_small.png"></button></td>
<td><button type="button" id="'.$id.'" onclick="classUsers(this.parentNode.parentNode)" style="cursor: pointer;"><img src="images/program/users.png"></button></td>
</tr>';
else
echo '<tr class="row_color_two_class" id="'.$id.'"><td>'.$id.'</td><td>'.$name.'</td><td>'.$date." ".$time.'</td><td>'.$teacher.'</td><td>'.$place.'</td><td>'.$message.'</td><td>'.$this->countUsersInClass($id)."/".$max_user.'
<td><button type="button" id="'.$id.'" onclick="removeClass(this.parentNode.parentNode, \''.$gym.'\')" style="cursor: pointer;"><img src="images/program/trash_small.png"></button></td>
<td><button type="button" id="'.$id.'" onclick="editClass(this.parentNode.parentNode)" style="cursor: pointer;"><img src="images/program/edit_small.png"></button></td>
<td><button type="button" id="'.$id.'" onclick="classUsers(this.parentNode.parentNode)" style="cursor: pointer;"><img src="images/program/users.png"></button></td>
</td>
</tr>';
$count++;
}
echo '</table></div>';
CSS:
.class_table
{
font-size: 20px;
margin-top:35px;
position:absolute;
width:15px;
max-width:15px;
}
.class_table > table {
table-layout: fixed;
}
结果:
如你所见,我的结果远超过 15px
最佳答案
给你的表格添加宽度应该可行
.class_table>table{
width: 100%;
}
它适合容器
关于html - 表格布局宽度被忽略 CSS HTML,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22429720/