0

私はテーブルを持っています.Firefoxまたはクロムでページをロードすると、画面から右にずれてほとんどのテーブルが消えます.テーブルは画面の中央に配置され、右側に重なっているようです.ページ領域の外側。

<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; }
4

3 に答える 3

1

doctype を追加してみてください:

たとえば、これは HTML5 doctype です。

<!DOCTYPE html>
于 2012-05-04T13:15:57.967 に答える
0

私にとってはうまくいくようです。

cssに問題があるのではないでしょうか？

編集: P タグのフロート スタイルが問題を引き起こしています。

簡単な解決策は、P タグの下に defloating-break-div (適切な名前はわかりません) を使用することです。

<div style="float:none;">
     <br />
</div>

これにより、コードの残りの部分が通常のレイアウトに戻ります

于 2012-05-04T13:21:07.250 に答える
0

1) テーブル構造にいくつかのエラーがあります

2) テーブルを中央に配置する必要がある場合は、margin-left および margin-right auto を設定できます。

align を使用した可能性のあるテーブル コードがあります。

<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>&nbsp;</td>
</tr></table>

それでも問題が解決しない場合: 詳細な分析のために、完全な HTML および CSS コードをどこかに投稿してください。

于 2012-05-04T23:34:54.950 に答える