قرار گرفتن جدول در وسط دایو [بایگانی]

IMANAZADI

سه شنبه 31 تیر 1393, 17:08 عصر

با سلام
ساختار صفحه لاگین من به شکل زیر می باشد
یک مشکلی داره
وقتی در اینترنت اکسپلورر اجرا میشه همه چیز درسته
ولی وقتی با گوگل کروم تست میزنم جدول از سمت چپ به دایو می چسبه (میخوام جدول در وسط دایو قرار بگیره )
کجای کدها ایراد داره ؟؟
اجرا در اکسپلورر
http://8pic.ir/images/i7j584jkpbbvypvukfy7.png

اجرا در گوگل کروم
http://8pic.ir/images/gqfza5jwzhgog3lio5e2.png

*
{
margin: 0;
padding: 0;
}

body
{

direction:ltr;
font-size: 12px;
font-family: Tahoma, Geneva, sans-serif;
height: 100%;
}

#container
{
margin: 0 auto;
width:300px;
border-radius: 6px;
height: 300px;
margin-top:12%;
}

#footer
{
position: fixed;
bottom: 0px;
height: 40px;
background-color: #CCC;
width: 100%;
border-radius: 6px;
}

tr
{
text-align:left;
width:50px;
min-height:20px;
}

input[type=password], input[type=text]
{
width:140px;
}

input[type=submit], input[type=reset]
{
width:60px;
}

.btn:hover
{
background-color:#09F;
color:#FFF;
}

<!doctype html><html><head><meta charset="utf-8"><title>Untitled Document</title>
<link rel="stylesheet" type="text/css" href="css/login.css"/>
</head>
<body>

<div id="container" style="background-color:#C93"><center><div id="message" style="background-color:#6CC"><?php

?></div></center><form action="check.php" method="post"><table height="240" align="center" cellspacing="10px" style="background-color:#C6F"> <tr> <td >Username</td> <td ><input type="text" name="username" placeholder="Username..." maxlength="50"></td> </tr> <tr> <td >Password</td> <td ><input type="password" name="password" placeholder="Password..." maxlength="50"></td> </tr> <tr> <td >Verification</td> <td ><img src="Captcha.php" alt="Captcha" onClick="changeCaptcha()" id="captchaimg" />
</tr> <tr> <td >Enter Code</td> <td><input type="text" name="captchacode" placeholder="Verification Code..." maxlength="5" ></td> </tr> <tr > <td colspan="2" >Remember Me <input type="checkbox" name="rememberme"> </td> </tr> <tr> <td colspan="2"><a href="#">Forget Password ?</a></td></tr> <tr> <td colspan="2"><input type="submit" class="btn" name="login" value="Login"> <input type="reset" class="btn" name="button" value="Reset"></td></tr></table></form>

</div>
<div id="footer"><a href="#" style="font-size:12px; text-align:center; display:block">@2014@</a></div>
</body>
</html>

mehbod.rayaneh

سه شنبه 31 تیر 1393, 18:03 عصر

درود
این نوع کد نویسی و استفاده از table , td , tr کلا منسوخ شده!!!
کمی css فرا بگیرید!!!
بخش body را اصلاح بفرمایید :

<body>
<div id="container" style="background-color:#C93">
<center>
<div id="message" style="background-color:#6CC">
<?php?>
</div>
</center>
<form action="check.php" method="post">
<table height="240" align="center" cellspacing="10px" style="background-color:#C6F;margin:0 auto">
<tr>
<td>Username</td>
<td><input type="text" name="username" placeholder="Username..." maxlength="50"></td>
</tr>
<tr>
<td>Password</td>
<td><input type="password" name="password" placeholder="Password..." maxlength="50"></td>
</tr>
<tr>
<td>Verification</td>
<td><img src="Captcha.php" alt="Captcha" onClick="changeCaptcha()" id="captchaimg" /></td>
</tr>
<tr>
<td>Enter Code</td>
<td><input type="text" name="captchacode" placeholder="Verification Code..." maxlength="5" ></td>
</tr>
<tr>
<td colspan="2">Remember Me<input type="checkbox" name="rememberme"></td>
</tr>
<tr>
<td colspan="2"><a href="#">Forget Password ?</a></td>
</tr>
<tr>
<td colspan="2">
<input type="submit" class="btn" name="login" value="Login">
<input type="reset" class="btn" name="button" value="Reset">
</td>
</tr>
</table>
</form>
</div>
<div id="footer"><a href="#" style="font-size:12px; text-align:center; display:block">@2014@</a></div>
</body>