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
#chart {
margin: 0 auto;
}
Use margin to center things.
try
#chart {
margin: 0 auto;
}
<div id="chart" > //remove align
You have placed that div within a table. So you need to do few things.
<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>
Change the table with to 100%
Center the alignment of td which holds div and width to 100%
<table border="0" cellpadding="10" cellspacing="0" width="100%">
<tr>
<td width="100%" valign="top" class="content" style="text-align:center;">
<div align="center">
Related
Im sending a mail from a template using Mailgun. But renders incorrectly on Gmail.
Im not using any style tags or any complex css.
ps: im not sure how much text i should add to be accpeted.
Here is the html template
Template:
<html xmlns="http://www.w3.org/1999/xhtml" style="margin:0;padding:0;">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Communication</title>
</head>
<body style="margin:0;padding:0;">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="center" valign="top" bgcolor="#fff" style="background-color:#fff;">
<table width="600" border="0" cellspacing="0" cellpadding="0" style="border: solid 1px #000;margin-top:60px;">
<tr>
<td align="left" valign="top" bgcolor="#001529" style="background-color:#001529; font-family:Arial, Helvetica, sans-serif; padding:10px;">
<div style="font-size:36px; color:#fff;">
<b>FORGOT YOUR PASSWORD?</b>
</div>
</td>
</tr>
<tr>
<td align="left" valign="top" bgcolor="#fff" style="background-color:#fff;">
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="left" valign="middle" style="color:#525252; font-family:Arial, Helvetica, sans-serif; padding:10px;">
<div style="font-size:16px;">
Dear {0},
</div>
<div style="font-size:16px;">
<p>A request has been received to reset your password for your -- account. Please click the button below to reset your password.</p>
<center>
<button type="button" title="Confirm Account Registration" style="background: #00415a;border:1px solid #00415a;">
<a href="{1}" style="font-size:22px; padding: 6px 12px; color: #f2faff;text-decoration:none;display:inline-block">
Reset Password Now
</a>
</button>
</center>
<p style="font-size:16px;">If you did not make this request please igonore this email.</p>
</div>
</td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="left" valign="middle" style="padding:15px; background-color:#00415a; font-family:Arial, Helvetica,sans-serif;font-size:12px; color:#f2faff;">
<p>Regards<br/>
-- © {2}</p>
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>
This is how it renders in Gmail:
Gmail:
Give a line-height to both title and button text, and should fix it.
Also i recommend against using margin-top or bottom in emails/tables but always go with padding instead. For some reason is more compatible. If you need some space above for instance, create a empty div above the element and give it a height.
Minifying the template seemed to fix the issue.
Bear in mind this is not a Gmail issue rather a Mailgun issue.
I got myself a custom landing page with a name and email opt in form, I can't figure out where to put the getresponse webform code in the landing page html.
here is the landing page html code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Untitled Document</title>
<style type="text/css">
<!--
body {
background-color: #BA0A0A;
}
.style14 {font-family: Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; color: #FFFFFF; }
.style15 {color: #FFFFFF}
.style3 {font-family: Tahoma;
color: #FFFFFF;
}
.style4 {
font-family: Arial, Helvetica, sans-serif;
font-size: 12pt;
font-weight: bold;
color: #000000;
}
.style10 {
font-family: Tahoma;
font-size: 12px;
color: #0033CC;
font-weight: bold;
}
.style21 {font-family: Tahoma; color: #B30006; }
-->
</style>
<link href="whitelinks.css" rel="stylesheet" type="text/css">
<style type="text/css">
<!--
.style24 {
color: #FFCC33;
font-size: 12px;
font-family: Tahoma;
font-weight: bold;
}
.style26 {color: #05320B}
.style27 {color: #0033CC}
a:link {
color: #0033CC;
}
a:visited {
color: #0033CC;
}
a:hover {
color: #0033CC;
}
a:active {
color: #0033CC;
}
-->
</style>
</head>
<body>
<table width="768" border="0" align="center" cellpadding="0" cellspacing="0" background="images/768header.jpg">
<tr>
<td height="150"><table width="768" height="150" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="30" height="100"> </td>
<td width="400"><div align="center" class="style3">
<h1> </h1>
</div></td>
<td width="338"> </td>
</tr>
<tr>
<td height="50"> </td>
<td> </td>
<td> </td>
</tr>
</table></td>
</tr>
</table>
<table width="768" border="0" align="center" cellpadding="0" cellspacing="0" background="images/fillertable.jpg">
<tr>
<td><div align="right">
<blockquote>
<blockquote>
<p></p>
</blockquote>
</blockquote>
</div></td>
</tr>
</table>
<table width="768" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td height="300" background="images/middle.jpg"><table align="center" border="0" cellpadding="0" cellspacing="0" width="768">
<tbody>
<tr>
<td background="images/middle.jpg" height="300"><table align="center" border="0" cellpadding="0" cellspacing="0" width="768">
<tbody>
<tr>
<td background="images/main.jpg" height="300"><table border="0" cellpadding="0" cellspacing="0" height="290" width="768">
<tbody>
<tr>
<td rowspan="3" width="30"> </td>
<td height="60" width="200"> </td>
<td rowspan="3" width="50"> </td>
<td rowspan="3" valign="top" width="428"><div align="center">
<h1 class="style21">FIRE YOUR BOSS! </h1>
<p align="right" class="style4">Download your FREE 10 Page report on getting<br>
started on your own BusinessToday! </p>
<div align="left">
<p class="style26"></p>
</div>
</div></td>
<td rowspan="3" width="50"> </td>
</tr>
<tr>
<td><center>
<form method="post" action="https://app.getresponse.com/site/johnmilner28/webform.html?wid=9908905&u=1vzV&mg_param3=4">
<input name="meta_web_form_id" value="yournumericvaluehere" type="hidden">
<input name="meta_split_id" value="" type="hidden">
<input name="unit" value="yournlistnamehere" type="hidden">
<input name="redirect" value="http://www.yourredirectpage.com/more.html" type="hidden">
<input name="meta_adtracking" value="sqtp001" type="hidden">
<input name="meta_message" value="1" type="hidden">
<input name="meta_required" value="from" type="hidden">
<input name="meta_forward_vars" value="0" type="hidden">
<table>
<tbody>
<tr>
<td colspan="2"><center>
<div> </div>
</center></td>
</tr>
<tr>
<td class="style14">Email:*</td>
<td><input name="from" value="" size="20" type="text"></td>
</tr>
<tr>
<td><span class="style14">Name</span><span class="style15">:*</span></td>
<td><input name="name" value="" size="20" type="text"></td>
</tr>
<tr>
<td colspan="2" align="center"><input name="submit" value="Show me!!" type="submit"></td>
</tr>
</tbody>
</table>
</form>
</center></td>
</tr>
<tr>
<td height="50"> </td>
</tr>
</tbody>
</table></td>
</tr>
</tbody>
</table></td>
</tr>
</tbody>
</table></td>
</tr>
</table>
<table width="768" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td class="style27"><img src="images/base.jpg" width="768" height="140"></td>
</tr>
</table>
<div align="center"><span class="style10">Terms & Conditions | Income Disclaimer | SupportDesk</span><span class="style27"><font face="MS Sans Serif"><br>
</font><span class="style24">Copyright 2007 © YOUR COPY INFORMATION HERE </span></span>
</div>
</body>
</html>
And here is the getresponse code: http://pastebin.com/hkusHw1y
Anyone know anything about this kind of stuff? I've been trying to figure it out all day.
The code you linked to actually seems to contain two different parts. Everything between <style> and <\style> should go inside the <head> section of your page. The rest of it lives in the <body> part of your page.
Moreover it is usually good practice to put the <script>...</script> line at the very end of your <body> so immediately before </body>. That way you are sure the all the DOM elements are loaded.
If you intent to work with this kind of stuff more often, you should start with some tutorials and small scale examples. Also I am confident that the getResponse page would have good instructions where to put their code on their website.
When viewed on an iPod or Mac (haven't tested other Apple devices), this webpage displays the text of a linked PDF over the text and photo of the original page where the PDF is linked from. I've tried making the link open in a blank window and that didn't resolve the issue (as I thought perhaps it was thinking it was embedded.
The code itself is: <p align="left" class="style1">May 2013 Short Course Info </p>
Background:A few years ago my wife built a simple webpage for a client who wanted a certain style webpage (antique looking?). Neither of us are programmers but I know enough HTML and CSS to error check and such. The website is old and not representative of our skills/abilities (wanted to get that out of the way now).
The full code for the page:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Course Information</title>
<link href="irving.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
.style3 {font-size: 16px}
-->
</style>
<script language="JavaScript">
<!--
function mmLoadMenus() {
if (window.mm_menu_0115210737_0) return;
window.mm_menu_0115210737_0 = new Menu("root",96,18,"Arial, Helvetica, sans-serif",12,"#030303","#FFFFFF","#FFFFFF","#000000","left","middle",3,0,1000,-5,7,true,true,true,0,true,true);
mm_menu_0115210737_0.addMenuItem("Biography","location='bio.html'");
mm_menu_0115210737_0.addMenuItem("Publications","location='publications.html'");
mm_menu_0115210737_0.addMenuItem("I.J.'s Food","location='moreinfo.html'");
mm_menu_0115210737_0.addMenuItem("Photos","location='photos.html'");
mm_menu_0115210737_0.hideOnMouseOut=true;
mm_menu_0115210737_0.bgColor='#300022';
mm_menu_0115210737_0.menuBorder=1;
mm_menu_0115210737_0.menuLiteBgColor='#300022';
mm_menu_0115210737_0.menuBorderBgColor='#030303';
mm_menu_0115210737_0.writeMenus();
} // mmLoadMenus()
//-->
</script>
<script language="JavaScript" src="mm_menu.js"></script>
</head>
<body>
<script language="JavaScript1.2">mmLoadMenus();</script>
<table width="794" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
<!--DWLayoutTable-->
<tr>
<td height="79" colspan="4" valign="middle" bgcolor="#000000" class="title"><img src="images/banner-black1.jpg" width="590" height="48" /></td>
</tr>
<tr bgcolor="#3366FF" class="a">
<td height="22" colspan="4" valign="top" bgcolor="#3366FF" class="navigation" id="navigation">Home I. J. Pflug Course InfoOrder BooksResourcesContact</td>
</tr>
<tr>
<td width="78" rowspan="3" valign="top"><!--DWLayoutEmptyCell--> </td>
<td height="88" colspan="2" valign="top" class="style1"><h1> </h1>
<h1>Information Regarding the Microbiology and Engineering of Sterilization Processes Course</h1></td>
<td width="60" rowspan="4" valign="top"><!--DWLayoutEmptyCell--> </td>
</tr>
<tr>
<td width="317" height="144" valign="top" background="Baxter M&ECseApr08,12Dec07.pdf"><br />
<p align="left"><span class="style1"><strong class="style1 style3">1. Upcoming Courses:</strong></span></p>
<p align="left" class="style1">May 2013 Short Course Info </p>
<p align="left" class="style1">May 1-3 , 2013 <br />
Baxter International Headquarters<br />
Deerfield, IL </p>
<p align="left"><strong><br />
<br />
</strong></p></td>
<td width="372" valign="top"><div align="left"></div>
<img src="images/class1.jpg" width="289" height="193" /></td>
</tr>
<tr>
<td colspan="2" rowspan="2" valign="top" class="style1"><p align="left" class="style2"> </p>
</td>
</tr>
<tr>
<td height="1774" valign="top"><!--DWLayoutEmptyCell--> </td>
</tr>
</table>
</body>
</html>
I have following page with code as below embeded in JSP.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>B2E</title>
<link rel="stylesheet" href="../style/global.css">
<link rel="stylesheet" href="../style/local.css">
<link rel="stylesheet" href="../style/calendarControl.css">
<script language="JavaScript" src="../jscripts/calendarControl.js"></script>
<script src="../jscripts/ajaxAction.js"></script>
<script language="javascript" src="../jscripts/ajaxMaster.js"></script>
</head>
<body>
<table border = "0" cellspacing="0" cellpadding="0" width = "100%">
<tr>
<td colspan="100%" bgcolor=""><img height="" src="../images/spacer.gif" width="100%"></td>
</tr>
<tr>
<td bgcolor="#FFFFFF" colspan="100%" align = "left" class="headerbg" height="30"> </td>
</tr>
<tr>
<td colspan="100%" bgcolor=""><img height="" src="../images/spacer.gif" width="100%"></td>
</tr>
</table>
<%//# include file="../includes/mainTheme.jsp"%>
<form action="" name="f">
<table align ="right">
<tr>
<td><input type="text" name="vs" value="" size="30" class="small"></td>
<td><input type="button" value="Find" onclick="return check()" class="small"/></td>
</tr>
<tr>
<td class="greysmall">(Enter visitor name/company name)</td>
</tr>
</table>
</form>
<table border = "0" cellspacing="0" cellpadding="0" width = "100%">
<tr>
<td colspan="100%" bgcolor=""><img height="1" src="../images/spacer.gif" width="100%"></td>
</tr>
</table>
<br>
<table border = "0" cellspacing="0" cellpadding="0" width = "100%" style="background-color:#9900FF" height="30">
<tr>
<td colspan="" bgcolor=""> </td>
<td colspan="" bgcolor="" >Home</td>
<td colspan="" bgcolor="" >Create Visit</td>
<td colspan="" bgcolor="" >Schedule Visit</td>
<!--<td colspan="" bgcolor="">Other Administrative Tasks</td>-->
<td colspan="" bgcolor="" >All Visitors</td>
<td colspan="" bgcolor="" >Exited Visitors</td>
<td colspan="" bgcolor="" >Scheduled Visitors</td>
<td colspan="" bgcolor="" >Black List Visitors</td>
<td colspan="" bgcolor="" >Daily Visitors</td>
</tr>
</table>
<br>
<table border = "0" cellspacing="0" cellpadding="0" width = "100%">
<tr>
<td colspan="100%" bgcolor=""><img height="1" src="../images/spacer.gif" width="100%"></td>
</tr>
</table>
<div id="txtHint" class="small" align="center" style="overflow:">
</div>
<br/>
<%//# include file="../includes/footer.jsp"%>
<%response.setContentType("text/xml");
response.setHeader("Cache-Control", "no-cache");
%>
</body>
</html>
when I process this page on Tomcat web server I am running into following error.
I am unable to solve this .
What is the cause of this error?
as Error suggest > expected , but there is no need to to place more > as it is alreadily closed properly.
Your link tags are not closed, nor are all of your break tags and image tags.
Fixed Example:
<link rel="stylesheet" href="../style/global.css"/>
<link rel="stylesheet" href="../style/local.css"/>
<link rel="stylesheet" href="../style/calendarControl.css"/>
I am looking to have a picture, name of the person, links to photos, biography, life, tell about you! a map tag where the location will be shown, also at the right, there will be details like like, Born: Nationality: Ocupation, Trakcs:
Can any body help me with a semantic html structure style with CSS Please use http://jsfiddle.net/ to build it online Thanks.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Your Yard Sales onproducts.line</title>
<link rel="stylesheet" href="" type="text/css" media="screen" />
</head>
<style type="text/css" >
#space {
margin-bottom:1.2em;
}
ul {
width: 100%;
float: left;
margin: 0 0 3em 0;
padding: 0;
list-style: none;
background-color: #f2f2f2;
border-bottom: 1px solid #ccc;
border-top: 1px solid #ccc; }
li {
float: left; }
li a {
display: block;
padding: 8px 15px;
text-decoration: none;
font-weight: bold;
color: #069;
border-right: 1px solid #ccc; }
</style>
<body>
<ul>
<li>Home</li>
<li>Members</li>
<li>Rollers</li>
<li>Info</li>
</ul>
<br/>
<br/>
<br/>
<br/>
<div id="space">
Roberto Kirt
</div>
<!--<ul><li>'.$name2.'</li>
<li>'.$name2.'</li>
<li>'.$name2.'</li></ul>-->
<table width="1768" cellpadding="0" cellspacing="0" border="0.5">
<tr>
<td width="493" height="149"><img style="border:#666 1px solid;" src="images/profileimages/8.jpg" alt="Angel Pilier "align="left" width="100" height="130" border="1" /></td>
<td width="1275"><table width="880" border="0.5" cellpadding="0" cellspacing="0">
<tr>
<td width="145" height="31"> </td><td></td>
</tr>
<tr>
<td height="44" align="right">Born:</td><td width="735">1975-11-23</td>
</tr>
<tr align="right">
<td height="38"></td>
>
</tr>
<tr>
<td height="36" align="right">Died:</td><td width="735">0000-00-00</td>
</tr>
</table></td>
</tr>
<tr><td height="31" colspan="2"> </td></tr>
<tr>
<td height="31">Photos</td>
<td rowspan="7"><table width="885" border="0" cellpadding="0" cellspacing="0">
<tr>
<td width="145" height="31" align="right"> Nationality:</td><td width="740"></td>
</tr>
<tr align="right">
<td height="25"> </td>
</tr>
<tr>
<td height="24" align="right">Spouse:</td><td width="740"></td>
</tr>
<tr align="right">
<td height="28"> </td>
</tr>
<tr>
<td height="27" align="right">Ocupation:</td><td width="740">Pianist</td>
</tr>
<tr align="right">
<td height="27"> </td>
</tr>
<td height="27" align="right">Childhood:</td><td width="740"></td>
</tr>
<tr align="right"><td height="27"> </td>
</tr>
<td height="27" align="right">Tracks:</td><td width="740"></td>
</tr>
<tr align="right">
<td height="119"> </td>
</tr>
</table>
</td>
</tr>
<tr>
<td height="25"> Biography</td>
</tr>
<tr>
<td height="25"> Life</td>
</tr>
<tr>
<td height="26">Tell an Anecdote</td>
</tr>
<tr>
</tr>
<tr>
</tr>
<tr>
<td><iframe width="700" height="350" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://maps.google.com/maps?f=q&source=s_q&hl=en&geocode=&q=Rochester,+New York,+United States&sspn=0.119541,0.110378&ie=UTF8&hq=&hnear=Rochester,+New York,+United States&z=14&output=embed"></iframe></td>
<!--<img src="images/foto.jpg" alt="nada" width="422" height="165" />-->
</tr>
</table>
</body>
</html>
#fello, there lot of things in your layout
1) use external stylesheet as much as possible because if you written your css in the head of html page it's make that html page heavy to load & you have to right new css in every new page.
2) try to avoid using table based structure as much as possible .Use div instead of table because it's flexible to use check this for more.
3)didn't use <br/> to much .If you want to give spacing you can give with margin & padding .
4)ever browser have applied some there own default properties .So, avoid it you have to use reset sheet .
5)for semantic markup check these links :
a) http://www.html-and-css-tutorial.com/tutorial-3.html
b) http://css-tricks.com/snippets/html/html5-page-structure/
c) http://themeshaper.com/2009/06/24/creating-wordpress-theme-html-structure-tutorial/
As far as I judge your question, use of some CSS framework like twitter-bootstrap will give you a very good and responsive layout in very less time :)
You might want to use hcard. This and other microformats are described here.