由于有表格，页脚不会停留在页面底部

本文介绍了由于有表格，页脚不会停留在页面底部的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！ 问题描述

我正在创建一个简单的内容管理系统，我的CSS和布局适用于除创建表之外的所有内容，然后以某种方式将页脚部分移动到其上方的包装器部分中.甚至表下方的文本也会在表上方输出.

I'm making a simple content management system, my CSS and layout works for everything apart from I make a table which then somehow moves the footer section to move into a wrapper sort of section above it. Even text below table gets output above the table.

我的基本布局...

<?php session_start(); //nav bar //top part of page which fully works etc include "header.php"; ?> <section class= "mainSection"> <section class = "subMain"> <p> this should be above </p> <?php include "/mysql/catgoryShow.php"; ?> <p> this should be below the table </p> </section> </section> <footer class = "mainFooter"> </footer> </body>

我的CSS重要部分...

my important parts of the css...

section.mainSection{ margin-left: 4%; margin-right:4%; min-height: 1000px; background-color: #ffffff; border-left-style:solid; border-left-color:#DAE3ED; border-left-width:5px; border-right-style:solid; border-right-color:#DAE3ED; border-right-width:5px; } section.subMain{ margin-left: 10%; margin-right: 10%; padding-top:10%; padding-bottom: 2%; }

我的页脚CSS

footer.mainFooter{ margin-left: 4%; margin-right:4%; height: 75px; background-color:#78B0F0; border-top-style:solid; border-top-color:#DAE3ED; border-top-width:5px; }

最后是我的桌子

<?php $result=mysql_query($query); $num=mysql_numrows($result); echo "<p>'$query' returns $num rows:<p>\r\n"; ?> <table border="0" cellspacing="2" cellpadding="2"> <tr> <td><font face="Arial, Helvetica, sans-serif">|Product ID|</font></td> <td><font face="Arial, Helvetica, sans-serif">|Product Name|</font></td> <td><font face="Arial, Helvetica, sans-serif">Product Category|</font></td> <td><font face="Arial, Helvetica, sans-serif">Product Minimum Age|</font></td> <td><font face="Arial, Helvetica, sans-serif">Product Discription|</font></td> <td><font face="Arial, Helvetica, sans-serif">Product Price|</font></td> <td><font face="Arial, Helvetica, sans-serif">Product Quantily Available|</font></td> <td><font face="Arial, Helvetica, sans-serif">View Product Page|</font></td> </tr> <?php $i=0; while ($i < $num) { $f1=mysql_result($result,$i,"ProductID"); $f2=mysql_result($result,$i,"ProductName"); $f3=mysql_result($result,$i,"ProductCategory"); $f4=mysql_result($result,$i,"SuitableAge"); $f5=mysql_result($result,$i,"ProductDiscription"); $f6=mysql_result($result,$i,"ProductPrice"); $f7=mysql_result($result,$i,"ProductAvailable"); ?> <tr> <td><font face="Arial, Helvetica, sans-serif"><?php echo $f1; ?></font></td> <td><font face="Arial, Helvetica, sans-serif"><?php echo $f2; ?></font></td> <td><font face="Arial, Helvetica, sans-serif"><?php echo $f3; ?></font></td> <td><font face="Arial, Helvetica, sans-serif"><?php echo $f4; ?></font></td> <td><font face="Arial, Helvetica, sans-serif"><?php echo $f5; ?></font></td> <td><font face="Arial, Helvetica, sans-serif"><?php echo $f6; ?></font></td> <td><font face="Arial, Helvetica, sans-serif"><?php echo $f7; ?></font></td> <td><font face="Arial, Helvetica, sans-serif"><?php echo $f7; ?></font></td> <td><font face="Arial, Helvetica, sans-serif"><a href="../cw/itemPage.php?id=<?php echo $f1?>">View Details</a></font></td> </tr> <?php $i++; } echo "<p>'$query' returns $num rows:<p>\r\n"; ?>

显示查询的两个回显都以某种方式在表之前打印出来:/

Both of the echos that show the query get printed before the table somehow aswell :/

推荐答案

如前所述-您必须使用适当的</table>标记关闭该表元素.在极少数情况下，表也可能继承一些浮动值，因此footer.mainFooter { clear: both; }应该可以解决此问题.

As noted before - you must close that table element with the appropriate </table> tag. In rare cases the table might also be inheriting some floating values so footer.mainFooter { clear: both; } should fix that.