iam new to web development, iam trying to move entire div to center of the page. But iam unable to do this, also not getting any error.
Below is the code of the html page.
<!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\">
<html>
<head>
<style>
#chart {
width:500px;
height:450px;
background-color:white;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
-khtml-border-radius: 20px;
border-radius: 20px;
behavior: url(PIE/PIE.htc);
}
</style>
<meta http-equiv=\"Content-Type\" content=\"text/html; charset=iso-8859-1\">
<title>Here goes some tilte</title>
<meta name=\"DESCRIPTION\" content=\"Determine your ring size in different countries.\">
<meta name=\"KEYWORDS\"
content=\"ring, size, USA, american, german, french, british, japanese, swiss\">
<SCRIPT LANGUAGE=\"JavaScript\" TYPE=\"text/javascript\">
function changeValues(which) {
document.countries.D1.selectedIndex = which;
document.countries.D2.selectedIndex = which;
document.countries.D3.selectedIndex = which;
document.countries.D4.selectedIndex = which;
document.countries.D5.selectedIndex = which;
document.countries.D6.selectedIndex = which;
document.countries.D7.selectedIndex = which;
document.countries.D8.selectedIndex = which;
document.countries.D9.selectedIndex = which;
}
// --></script>
<link href=\"/style.css\" rel=\"stylesheet\" type=\"text/css\">
<link href=\"/print.css\" rel=\"stylesheet\" type=\"text/css\" media=\"print\">
<script language=\"JavaScript\" src=\"/misc_functions.js\" type=\"text/javascript\"></script>
</head>
<body bgcolor=\"pink\">
<div align=\"center\" id=\"chart\" >
<center>
<table border=\"0\" cellpadding=\"10\" cellspacing=\"0\" width=\"450\">
<tr>
<td width=\"470\" valign=\"top\" class=\"content\">
<div align=\"center\">
<span class=\"red\"><font color=\"Black\"><h3>Here will be having a static data on the form<h3></font></span>
</div>
</td>
</tr>
</table>
<!-- Place main data here -->
<script language=\"JavaScript\" src=\"/browser_detection.js\" type=\"text/javascript\"></script>
<noscript>
<blockquote>
<p><font size=\"3\" color=\"#FF0000\"><b>You do not have JavaScript enabled.</b></font><br>
<font size=\"2\" color=\"#000080\">The conversions on this site require the use of JavaScript so please enable before continuing.
For assistance in enabling JavaScript, please contact the webmaster.</font></p>
</blockquote>
</noscript>
<form method=\"POST\" name=\"countries\">
<div align=\"center\">
<table border=\"0\" style=\"border: 1px solid rgb(255,0,0)\">
<tr>
<td align=\"center\" bgcolor=\"#DFDFDF\">USA </td>
<td align=\"center\" bgcolor=\"#D5D5FF\">INDIA</td>
<td align=\"center\" bgcolor=\"#D5D5FF\">PAKISTAN</td>
<td align=\"center\" bgcolor=\"#D5D5FF\">CHINA</td>
</tr>
<tr>
<td align=\"center\" bgcolor=\"#DFDFDF\"><select name=\"D1\" size=\"1\"
onChange=\"changeValues(document.countries.D1.selectedIndex);\">
<option> ---</option>
<option>Damodar</option>
</select></td>
<td align=\"center\" bgcolor=\"#D5D5FF\"><select name=\"D2\" size=\"1\"
onChange=\"changeValues(document.countries.D2.selectedIndex);\">
<option> ---</option>
<option>Damodar</option>
</select></td>
<td align=\"center\" bgcolor=\"#D5D5FF\"><select name=\"D3\" size=\"1\"
onChange=\"changeValues(document.countries.D3.selectedIndex);\">
<option> ---</option>
<option>Damodar</option>
</select></td>
<td align=\"center\" bgcolor=\"#D5D5FF\"><select name=\"D4\" size=\"1\"
onChange=\"changeValues(document.countries.D4.selectedIndex);\">
<option> ---</option>
<option>Damodar</option>
</select></td>
</tr>
</table>
</div>
<div align=\"center\">
<table border=\"0\" style=\"border: 1px solid rgb(255,0,0)\">
<tr>
<td align=\"center\" bgcolor=\"#DFDFDF\">British</td>
<td align=\"center\" bgcolor=\"#DFDFDF\">French</td>
<td align=\"center\" bgcolor=\"#DFDFDF\">German</td>
<td align=\"center\" bgcolor=\"#DFDFDF\">Japanese</td>
<td align=\"center\" bgcolor=\"#DFDFDF\">Swiss</td>
</tr>
<tr>
<td align=\"center\" bgcolor=\"#DFDFDF\"><select name=\"D5\" size=\"1\"
onChange=\"changeValues(document.countries.D5.selectedIndex);\">
<option> ---</option>
<option>Damodar</option>
</select></td>
<td align=\"center\" bgcolor=\"#DFDFDF\"><select name=\"D6\" size=\"1\"
onChange=\"changeValues(document.countries.D6.selectedIndex);\">
<option> ---</option>
<option>Damodar</option>
</select></td>
<td align=\"center\" bgcolor=\"#DFDFDF\"><select name=\"D7\" size=\"1\"
onChange=\"changeValues(document.countries.D7.selectedIndex);\">
<option> ---</option>
<option>Damodar</option>
</select></td>
<td align=\"center\" bgcolor=\"#DFDFDF\"><select name=\"D8\" size=\"1\"
onChange=\"changeValues(document.countries.D8.selectedIndex);\">
<option> ---</option>
<option>Damodar</option>
</select></td>
<td align=\"center\" bgcolor=\"#DFDFDF\"><select name=\"D9\" size=\"1\"
onChange=\"changeValues(document.countries.D9.selectedIndex);\">
<option> ---</option>
<option>Damodar</option>
</select></td>
</tr>
</table>
</div>
</center>
</form>
<table>
<tr>
<td>
<p align=\"center\"><font color=\"#800000\">Here will be having a static data on the form</font></p>
<p><font color=\"#000080\"><big>Here will be having a static data on the form</big></font><ol>
<li><font color=\"#004080\">Here will be having a static data on the form</font></li>
<li><font color=\"#004080\">Here will be having a static data on the form</font></li>
</ol></p>
</td>
</tr>
<table>
</center>
</div>
</div>
</body>
</html>
Below iam attaching the screenshot, in that you can find the curvedbox, it is left to the page, i want that curved box and the under that elements to center.
Please can any one suggest how to do it
Rating:
The post html – Unable to move entire div to center of the page appeared first on Javascript ASK.
via Javascript ASK http://javascriptask.phpfogapp.com/html-unable-to-move-entire-div-to-center-of-the-page.html
No comments:
Post a Comment