表在Firefox和Chrome中消失 我有一个表，当我在Firefox或Chrome中加载页面时，它从屏幕上移到右边，导致大多数表消失，表应该位于屏幕中间，并且似乎在页面区域的右侧重叠。 <html lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title>Small North Run</title> <meta name="description" content=" "> <meta name="keywords" content=" "> <link rel="stylesheet" href="default.css" type="text/css"> <link rel="stylesheet" href="sponsor.css" type="text/css"> </head> <body> <div id="wrapper"> <header> <h1>SMALL NORTH RUN</h1> </header> <nav> <ul id="navlist"> <li><a href="./">HOME</a></li> <li><a href="training">TRAINING REGIME</a></li> <li><a href="./forum">FORUM</a></li> <li><a href="./sponsor.php">SPONSOR</a></li> <li><a href="./contact.php">CONTACT</a></li> </ul> </nav> <hr id="hrnav" /> <div id="content"> <p>This page allows you to sponsor a particular runner. Just simply select the name of the runner you wish to sponsor from the drop down list, then enter the amount you wish to donate followed by a brief message for the runner and then your name. Once making a donation the runner you have sponsored will be notified by email that you have made a donation.</p> <br/> <br/> <br/> <br/> <form method="post" action="test.php"> <table> <tr><td><label>Runner:</label></td> <td> <select name="fullname"> <?php do{?> <option value="<?php echo $rsNames['user_ID']; ?>"> <?php echo $rsNames['first_Name'];?> <?php echo $rsNames['last_Name'];?></option> <?php } while ( $rsNames= mysql_fetch_assoc($names_query))?> </select> </td> </tr> <tr><td><label>Donation (£):</label></td><td><input type="text" maxlength="9" value="0.00" name="donation"/></td></tr> <tr> <td> <label>Message:</label> </td> <td> <textarea name="donationmessage" maxlength="200" cols="25" rows="6"> </textarea> </td> </tr> </tr> <tr><td><label>Your Name:</label></td><td><input type="text" maxlength="30" name="donator"/></td></tr> <tr> <td> <tr><td><input id="submit" type="submit" value="Confirm Donation"/></td></tr> </table> </form> </div> </div> <!-- END WRAPPER --> </body> </html> CSS #content { text-align: left; margin: 2px; padding: 10px; } #content p { font: font: 12px/1.5 Verdana, sans-serif; float: left; }
尝试添加doctype： 例如，这里是HTML5 doctype表在Firefox和Chrome中消失 我有一个表，当我在Firefox或Chrome中加载页面时，它从屏幕上移到右边，导致大多数表消失，表应该位于屏幕中间，并且似乎在页面区域的右侧重叠。 <html lang="en"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"> <title>Small North Run</title> <meta name="description" content=" "> <meta name="keywords" content=" "> <link rel="stylesheet" href="default.css" type="text/css"> <link rel="stylesheet" href="sponsor.css" type="text/css"> </head> <body> <div id="wrapper"> <header> <h1>SMALL NORTH RUN</h1> </header> <nav> <ul id="navlist"> <li><a href="./">HOME</a></li> <li><a href="training">TRAINING REGIME</a></li> <li><a href="./forum">FORUM</a></li> <li><a href="./sponsor.php">SPONSOR</a></li> <li><a href="./contact.php">CONTACT</a></li> </ul> </nav> <hr id="hrnav" /> <div id="content"> <p>This page allows you to sponsor a particular runner. Just simply select the name of the runner you wish to sponsor from the drop down list, then enter the amount you wish to donate followed by a brief message for the runner and then your name. Once making a donation the runner you have sponsored will be notified by email that you have made a donation.</p> <br/> <br/> <br/> <br/> <form method="post" action="test.php"> <table> <tr><td><label>Runner:</label></td> <td> <select name="fullname"> <?php do{?> <option value="<?php echo $rsNames['user_ID']; ?>"> <?php echo $rsNames['first_Name'];?> <?php echo $rsNames['last_Name'];?></option> <?php } while ( $rsNames= mysql_fetch_assoc($names_query))?> </select> </td> </tr> <tr><td><label>Donation (£):</label></td><td><input type="text" maxlength="9" value="0.00" name="donation"/></td></tr> <tr> <td> <label>Message:</label> </td> <td> <textarea name="donationmessage" maxlength="200" cols="25" rows="6"> </textarea> </td> </tr> </tr> <tr><td><label>Your Name:</label></td><td><input type="text" maxlength="30" name="donator"/></td></tr> <tr> <td> <tr><td><input id="submit" type="submit" value="Confirm Donation"/></td></tr> </table> </form> </div> </div> <!-- END WRAPPER --> </body> </html> CSS #content { text-align: left; margin: 2px; padding: 10px; } #content p { font: font: 12px/1.5 Verdana, sans-serif; float: left; },html,css,html-table,Html,Css,Html Table,尝试添加doctype： 例如，这里是HTML5 doctype <!DOCTYPE html> 这对我来说似乎很管用 也许你的css有问题 编辑： P标签上的浮动样式导致了问题 一个简单的解决方案是使用一个defloting break div，我不确定p标签下面的正确名称是什么： <div style="float:none;"> <br /> </div> 这将导致代码的其余部分恢复正常布局1如果表结构中有一些错误 2如果您需要
<!DOCTYPE html>
这对我来说似乎很管用 也许你的css有问题 编辑： P标签上的浮动样式导致了问题 一个简单的解决方案是使用一个defloting break div，我不确定p标签下面的正确名称是什么：
<div style="float:none;">
<br />
</div>
这将导致代码的其余部分恢复正常布局1如果表结构中有一些错误 2如果您需要将表格居中，您可以将其设置为自动左边距和自动右边距 可能存在带有对齐的表代码：
<table style='margin: 0 auto;'>
<tr>
<td><label>Runner:</label></td>
<td>
<select name="fullname">
<?php do{?>
<option value="<?php echo $rsNames['user_ID']; ?>"> <?php echo $rsNames['first_Name'];?> <?php echo $rsNames['last_Name'];?></option>
<?php } while ( $rsNames= mysql_fetch_assoc($names_query))?>
</select>
</td>
</tr>
<tr>
<td><label>Donation (£):</label></td>
<td><input type="text" maxlength="9" value="0.00" name="donation"/></td>
</tr>
<tr>
<td><label>Message:</label></td>
<td><textarea name="donationmessage" maxlength="200" cols="25" rows="6"> </textarea></td>
</tr>
<tr>
<td><label>Your Name:</label></td>
<td><input type="text" maxlength="30" name="donator"/></td>
</tr>
<tr>
<td><input id="submit" type="submit" value="Confirm Donation"/></td>
<td> </td>
</tr></table>
如果您仍然有问题：发布完整的HTML和CSS代码以进行详细分析。您可以粘贴用于的CSS吗？请包括default.CSS和consort.CSS。由于浏览器没有边距，文本缩进那么远，所以一定会有冲突。Chrome和Firefox被编程为猜测DOCTYPE，但编写DOCTYPE总是一个很好的做法，我认为问题在于CSS。