I am trying to obtain this InputBox:
(source: instructables.com)
with this html code
<body style="background-color:#EEEEEE" onkeypress='vbs:Default_Buttons' align='top'>
<table width='90%' height='100%' align='center' border='0'>
<tr border='0'>
<td align="left" style="font-family: arial; font-size: 11px;">
Un Message
</td>
<td align='right'>
<table align='right'>
<tr align='right'>
<input type="button" value="OK" name="btn_OK" onClick="vbs: Run_ProgramOK" style="font-size: 11px;">
<input type="button" value="Cancel" name="btn_Cancel" onClick="vbs: Run_ProgramCancel" style="font-size: 11px;"><br><br>
</tr>
</table>
</td>
</tr>
</table>
<table width='90%' height='100%' align='center' border='0'>
<tr>
<td align='left' style="font-family: arial; font-size: 16px; font-weight: bold;">
<input type="text" size="60" id="txt_input"
name="txt_input" style="font-size: 11px;" value="Un Input" ><BR>
<!-- <input type="password" -->
</td>
</tr>
</table>
</body>
but I can't get things right, the buttons are not left aligned.
I do not handle the table rows and column correctly
Check out this:
Click here!
Should look more like the thing you are looking for, let me know if you wanted something else basically just aligned it to the left instead and gave it margin/right/top to position it exactly where it should be - not responsive, can be added.
Let me know what you think
<body style="background-color:#EEEEEE" onkeypress='vbs:Default_Buttons' align='top'>
<table width='90%' height='100%' align='center' border='0'>
<tr border='0'>
<td align="left" style="font-family: arial; font-size: 11px;">
Un Message
</td>
<td align='left' style="margin-top: 5em;">
<table align='left' style="margin-right: 7.2em;">
<tr align='left' "margin-top: 5em;">
<input type="button" value="OK" name="btn_OK" onClick="vbs: Run_ProgramOK" style="font-size: 11px; width: 5em; margin-top: 4em;"><br>
<input type="button" value="Cancel" name="btn_Cancel" onClick="vbs: Run_ProgramCancel" style="font-size: 11px; width: 5em;"><br><br>
</tr>
</table>
</td>
</tr>
</table>
<table width='90%' height='100%' align='center' border='0'>
<tr>
<td align='left' style="font-family: arial; font-size: 16px; font-weight: bold;">
<input type="text" size="60" id="txt_input"
name="txt_input" style="font-size: 11px;" value="Un Input" ><BR>
<!-- <input type="password" -->
</td>
</tr>
</table>
</body>
But like the guy who replied to you first said, tables are redudant, use div
Related
I am helping a friend build her website. I am trying to install Recaptcha page on her website because her HTML is really old. I accidentally deleted the html code for her contact us page so now I am trying to rebuild the page. It's very basic but for the life of me, I can't move the contact us form to the center of the page. Could someone send some code for me to set the "contact us" form to the center of the page?
I pasted this code to build a form:
<div class="container">
<div style="text-align:center">
<h2>Contact Us</h2>
</div>
<div class="row">
<div class="column">
</div>
<div class="column">
<form action="/action_page.php">
<label for="fname">Name</label>
<input type="text" id="name" name="name" placeholder="Your name..">
<label for="email">Email</label>
<input type="text" id="email" name="Email" placeholder="Your email...">
<label for="subject">Subject</label>
<textarea id="subject" name="subject" placeholder="Write something.." style="height:170px"></textarea>
<input type="submit" value="Submit">
</form>
</div>
</div>
</div>
Because I lost the original contact us page I copied the code from one of her other pages and am trying to find where I can implement the form on the page. This is the page code I copied on the contact us form""
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Fidelis Design & Construction, LLC</title>
<style type="text/css">
<!--
body {
background-image: url(BGs/RH.png);
background-repeat: repeat-x;
margin-left: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
}
.style1 {
background-repeat: no-repeat;
}
.style2 {
font-family: Arial, Helvetica, sans-serif;
font-size: 0.689em;
color: #FFFFFF;
}
.style9 { font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
font-weight: bold;
color: #FFFFFF;
}
.style3 {
font-family: Arial, Helvetica, sans-serif;
font-size: 0.689em;
color: #333;
}
.style6 {
color: #000033;
font-weight: bold;
font-family: Arial, Helvetica, sans-serif;
font-size: 14px;
text-decoration:none;
}
a:hover {
color: #A52113;
}
.style7 {
color: #A52113;
font-weight: bold;
}
.style10 {
font-family: Arial, Helvetica, sans-serif;
font-size: 0.8125em;
color: #333;
}
.style11 {
color: #A52113;
font-size: medium;
font-weight: bold;
font-family: Arial, Helvetica, sans-serif;
}
.style12 {
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #A52113;
font-weight: bold;
}
</style>
</head>
<body>
<table width="1045" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="200" height="270" align="center" bgcolor="#000033"><img src="BGs/logo.jpg" alt="Fidelis Design and Construction" width="135" height="189" border="0" longdesc="http://www.fidelisdc.com" /></td>
<td width="845" rowspan="5" align="left" valign="top"><table width="775" border="0" align="right" cellpadding="0" cellspacing="0">
<tr>
<td width="93"> </td>
<td width="137"> </td>
<td width="170"> </td>
<td width="75"> </td>
<td width="175"> </td>
<td width="125"> </td>
</tr>
<tr>
<td align="left" valign="top"><img src="BGs/sdvosb_logo_alt.png" width="93" height="89" /></td>
<td colspan="5"><table width="682" border="0" cellspacing="0" cellpadding="0">
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td height="30" colspan="5" align="right" valign="bottom" background="BGs/HD.png"><table width="682" border="0" cellspacing="0" cellpadding="0">
<tr>
<td align="right"></td>
</tr>
<tr>
<td align="right"><span class="style3"> <span class="style4"><span class="style7">Corporate Headquarters :</span></span> 408 East 4th Street, Suite 308, Bridgeport, PA 19405. <span class="style4"><span class="style7">P</span></span> (610) 277-7094 <span class="style4"> <span class="style7">F</span></span> (610) 277-7095<span class="style4"> </span></span></td>
</tr>
</table></td>
</tr>
<tr>
<td height="20"> </td>
<td colspan="4" align="right" valign="bottom"><span class="style6">Home | About Our Founder | Current Projects | Service Strategy | Contact Us </span></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table></td>
</tr>
<tr>
<td colspan="2" rowspan="2"><img src="BGs/SS.png" width="129" height="16" /></td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td height="20" colspan="6" align="left" class="style10">At FDC we are operations driven, providing our clients with exceptional services and expertise, resulting in the highest quality projects </td>
</tr>
<tr>
<td height="20" colspan="6" align="left"><span class="style10">delivered in the safest manner. </span></td>
</tr>
<tr>
<td height="20" colspan="6" align="left" class="style10">FDC seeks to develop loyal, long-term client relationships which result in desired profits, strategic partnerships and opportunities.</td>
</tr>
<tr>
<td height="20" colspan="6" align="left"> </td>
</tr>
<tr>
<td height="20" colspan="4" align="left" class="style10"><strong>Our services include:</strong></td>
<td colspan="2" rowspan="9" align="right"> </td>
</tr>
<tr>
<td height="20" colspan="4" align="left"><span class="style11">• </span><span class="style10">Construction capabilities using state-of-the-art technology & equipment</span></td>
</tr>
<tr>
<td height="20" colspan="4" align="left" class="style10"><span class="style11">• </span>Comprehensive estimating and pricing procedures</td>
</tr>
<tr>
<td height="20" colspan="4" align="left" class="style10"><span class="style11">• </span>Critical path sequencing</td>
</tr>
<tr>
<td height="20" colspan="4" align="left" class="style10"><span class="style11">• </span>Design-Build Contracting Capabilities</td>
</tr>
<tr>
<td height="20" colspan="4" align="left" class="style10"><span class="style11">• </span>Materials procurement </td>
</tr>
<tr>
<td height="20" colspan="4" align="left" class="style10"><span class="style11">• </span>Project management </td>
</tr>
<tr>
<td height="20" colspan="4" align="left" class="style10"><span class="style11">• </span>Subcontractor prequalification </td>
</tr>
<tr>
<td height="20" colspan="4" align="left" class="style10"><span class="style11">• </span>Value engineering and constructability reviews</td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
<td> </td>
</tr>
</table></td>
</tr>
<tr>
<td height="15"> </td>
</tr>
<tr>
<td height="135" align="center" bgcolor="#EFEFEF"><table width="160" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="39" colspan="2" background="BGs/PDFHeader.png" class="style1"> </td>
</tr>
<tr>
<td width="45" align="center"><a href="PDF/philadelphia_weekly_rbennett.pdf" target="_blank" ><img src="BGs/pdf_icon.jpg" width="32" height="33" border="0" title="Click to download / open this document" /></a></td>
<td width="115"><img src="BGs/Readmore.png" width="113" height="26" border="0" title="Click to download / open this document" /></td>
</tr>
</table></td>
</tr>
<tr>
<td height="15"> </td>
</tr>
<tr>
<td height="265" align="center" bgcolor="#000033"><table width="160" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="170" height="25" background="BGs/Contact.png" class="style1"> </td>
</tr>
<tr>
<td height="18" align="left"><span class="style12">Corporate Headquarters :</span></td>
</tr>
<tr>
<td height="18" align="left" class="style2">408 East 4th Street</td>
</tr>
<tr>
<td height="18" align="left" class="style2">Suite 308</td>
</tr>
<tr>
<td height="18" align="left" class="style2">Bridgeport, PA 19405</td>
</tr>
<tr>
<td height="18" align="left"><span class="style2"><strong>P</strong> (610) 277-7094</span></td>
</tr>
<tr>
<td height="18" align="left" class="style2"><strong>F</strong> (610) 277-7095</td>
</tr>
<tr>
<td height="18" align="left" class="style2">--------------------------------------</td>
</tr>
<tr>
<td align="left"><img src="BGs/Email.png" width="103" height="52" border="0" title="Contact Us"/></td>
</tr>
<tr>
<div class="container">
<div style="text-align:right">
<h2>Contact Us</h2>
</div>
<div class="row">
<div class="column">
</div>
<div class="column">
<form action="/action_page.php">
<label for="fname">Name</label>
<input type="text" id="name" name="name" placeholder="Your name..">
<label for="email">Email</label>
<input type="text" id="email" name="Email" placeholder="Your email...">
<label for="subject">Subject</label>
<textarea id="subject" name="subject" placeholder="Write something.." style="height:170px"></textarea>
<input type="submit" value="Submit">
</form>
</div>
</div>
</div>
</tr>
</table></td>
</tr>
<tr>
<td height="15"> </td>
<td> </td>
</tr>
</table>
<table width="100%" border="0" cellspacing="0" cellpadding="0">
<tr>
<td height="40" bgcolor="#000033"><table width="1045" border="0" align="center" cellpadding="0" cellspacing="0">
<tr>
<td width="524" align="left"><span class="style9">Copyright © 2015, Fidelis Design & Construction, LLC. All Rights Reserved.</span></td>
</tr>
</table></td>
</tr>
</table>
</body>
</html>
You can apply display: flex; and justify-content: center;" to the column class that's wrapping you form. I would however, suggest adding a differently named class to it to avoid interference with the column class just before it. e.g. <div class="column form-wrapper">
I have a HTML table in which a background color is set on each cell. As a result, the contrast between two bg colors appears as a border. Please refer to accepted solution at
Borders around every cell and table
This is a follow up question.
Now I need to include bootstrap in my application. However, as soon as I include bootstrap CSS the border appearance disappears (even if I don't include any bootstrap class). How can I include bootstrap and still have a border like appearance around each cell.
Here is the fiddle with bootstrap included
https://jsfiddle.net/hqkw4x1s/1/
and below is the original code, without reference to bootstrap css (this gives a border like appearance due to bgcolors)
.lab {
HEIGHT: 18px; FONT-WEIGHT: normal; TEXT-ALIGN: left; PADDING-LEFT: 4px; PADDING-RIGHT: 3px; BACKGROUND-COLOR: #e6f6f6
}
.val {
PADDING-BOTTOM: 1px; PADDING-TOP: 1px; PADDING-LEFT: 2px; PADDING-RIGHT: 3px; BACKGROUND-COLOR: white
}
<FORM>
<DIV>
<TABLE width="100%" bgColor=#cecece border=0 cellSpacing=1 cellPadding=0>
<TBODY>
<TR vAlign=middle>
<TD width="6%" class=lab>Country</TD>
<TD width="44%" class=val>
<INPUT name="A" id="A" type=checkbox CHECKED>
<LABEL for="A">A</LABEL>
<INPUT name="B" id="B" type=checkbox CHECKED>
<LABEL for="B">B</LABEL>
</TD>
<TD width="6%" class=lab>States</TD>
<TD width="44%" class=val>
<TABLE width="100%" border=0 cellSpacing=0 cellPadding=0>
<TBODY>
<TR>
<TD>
<SELECT>
<OPTION value="p" selected>P</OPTION>
<OPTION value="q">Q</OPTION>
<OPTION value="r">R</OPTION>
</SELECT>
</TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
<TR vAlign=middle>
<TD class=lab>Ownership</TD>
<TD class=val>
<TABLE width="100%" border=0 cellSpacing=0 cellPadding=0>
<TBODY>
<TR>
<TD><TEXTAREA style="WIDTH: 95%" rows=1 cols=20></TEXTAREA></TD>
<TD style="WIDTH: 75px; TEXT-ALIGN: left"><SPAN
style="BACKGROUND-COLOR: #f8f8f8"></SPAN>
</TD>
</TR>
</TBODY>
</TABLE>
</TD>
<TD class=lab>Partnership</TD>
<TD class=val><INPUT type=text xHeight="32px"> </TD>
</TR>
<TR vAlign=middle>
<TD class=lab>Accounts Payable</TD>
<TD
style="PADDING-LEFT: 2px; PADDING-RIGHT: 3px; BACKGROUND-COLOR: white">
<INPUT type=text>
</TD>
<TD class=lab>Start Date</TD>
<TD class=val>
<INPUT type=text xHeight="32px">
</TD>
</TR>
</TBODY>
</TABLE>
</DIV>
</FORM>
Please update below table tag.Here you just need to use the bootstrap standard class to achieve this.
Instead
<table width="100%" bgcolor="#cecece" border="0" cellspacing="1" cellpadding="0">
Should be:
<table class="table table-bordered" width="100%" bgcolor="#cecece" border="0" cellspacing="1" cellpadding="0">
I'm not so good with using display values to organize forms, it would be great if you would give me an example of being able to organize in an up-to-date way.
I'm making a login/register system, and I want to center the input fields in the div. Here's the code of the login form:-
<body style='font-family: Times New Roman, verdana, sans-serif;'>
<div style='width: 70%; padding 10px; border: 5px solid #316ED6; background-color: #648CD1; color: #31D8EB; margin: auto; text-align: center;'>
<h1>Register Now!</h1>
<br />
<form action='' method='post'/>
<table>
<tr>
<td>
<b>Username:</b>
</td>
<td>
<input type='text' name='username' style='padding: 4px'/>
</td>
<tr>
<td>
<b>Password:</b>
</td>
<td>
<input type='password' name='password' style='padding: 4px'/>
</td>
</tr>
<tr>
<td>
<b>Re-enter Password</b>
</td>
<td>
<input type='passsword' name='passwordconfirm' style='padding: 4px'/>
</td>
</tr>
<tr>
<td>
<b>First and Last Name:</b>
</td>
<td>
<input type='text' name='name' style='padding: 4px'/>
</td>
</tr>
<tr>
<td>
<input type='submit' name='register' value='Complete Registration'/>
</td>
</tr>
</table>
</form>
<h4>Already own a Connection account? Login <a href='index.php'>Here!</a></h4>
</div>
</body>
Simplest possible is to give the form display: inline-block.
Setting text-align: left; on the table will control the labels text alignment
<body style='font-family: Times New Roman, verdana, sans-serif;'>
<div style='width: 70%; padding 10px; border: 5px solid #316ED6; background-color: #648CD1; color: #31D8EB; margin: auto; text-align: center;'>
<h1>Register Now!</h1>
<br />
<form action='' method='post' style="display: inline-block" />
<table style="text-align: center;">
<tr>
<td>
<b>Username:</b>
</td>
<td>
<input type='text' name='username' style='padding: 4px'/>
</td>
<tr>
<td>
<b>Password:</b>
</td>
<td>
<input type='password' name='password' style='padding: 4px'/>
</td>
</tr>
<tr>
<td>
<b>Re-enter Password</b>
</td>
<td>
<input type='passsword' name='passwordconfirm' style='padding: 4px'/>
</td>
</tr>
<tr>
<td>
<b>First and Last Name:</b>
</td>
<td>
<input type='text' name='name' style='padding: 4px'/>
</td>
</tr>
<tr>
<td>
</td>
<td>
<input type='submit' name='register' value='Complete Registration' style="width: 100%"/>
</td>
</tr>
</table>
</form>
<h4>Already own a Connection account? Login <a href='index.php'>Here!</a></h4>
</div>
</body>
Side note:
By updating the last tr like this, you'll get a nice positioned button too
<tr>
<td>
</td>
<td>
<input type='submit' name='register' value='Complete Registration' style="width: 100%"/>
</td>
</tr>
you could just add a css rule to your table
table{
margin:0 auto;
}
The Easiest way to do this is to use the center tag <center> </center>
I edited your code to center the entire form.
<body style='font-family: Times New Roman, verdana, sans-serif;'>
<div style='width: 70%; padding 10px; border: 5px solid #316ED6; background-color: #648CD1; color: #31D8EB; margin: auto; text-align: center;'>
<h1>Register Now!</h1>
<br />
<center>
<form action='' method='post'/>
<table>
<tr>
<td>
<b>Username:</b>
</td>
<td>
<input type='text' name='username' style='padding: 4px'/>
</td>
<tr>
<td>
<b>Password:</b>
</td>
<td>
<input type='password' name='password' style='padding: 4px'/>
</td>
</tr>
<tr>
<td>
<b>Re-enter Password</b>
</td>
<td>
<input type='passsword' name='passwordconfirm' style='padding: 4px'/>
</td>
</tr>
<tr>
<td>
<b>First and Last Name:</b>
</td>
<td>
<input type='text' name='name' style='padding: 4px'/>
</td>
</tr>
<tr>
<td>
<input type='submit' name='register' value='Complete Registration'/>
</td>
</tr>
</table>
</form>
</center>
<h4>Already own a Connection account? Login <a href='index.php'>Here!</a></h4>
</div>
</body>
snippet below
form{
text-align:center;
}
#form_table{
display:inline-table;
}
<body style='font-family: Times New Roman, verdana, sans-serif;'>
<div style='width: 70%; padding 10px; border: 5px solid #316ED6; background-color: #648CD1; color: #31D8EB; margin: auto; text-align: center;' id="meta_container">
<h1>Register Now!</h1>
<br />
<form action='' method='post'/>
<table id="form_table">
<tr>
<td>
<b>Username:</b>
</td>
<td>
<input type='text' name='username' style='padding: 4px' />
</td>
<tr>
<td>
<b>Password:</b>
</td>
<td>
<input type='password' name='password' style='padding: 4px' />
</td>
</tr>
<tr>
<td>
<b>Re-enter Password</b>
</td>
<td>
<input type='passsword' name='passwordconfirm' style='padding: 4px' />
</td>
</tr>
<tr>
<td>
<b>First and Last Name:</b>
</td>
<td>
<input type='text' name='name' style='padding: 4px' />
</td>
</tr>
<tr>
<td>
<input type='submit' name='register' value='Complete Registration' />
</td>
</tr>
</table>
</form>
<h4>Already own a Connection account? Login <a href='index.php'>Here!</a></h4>
</div>
</body>
<form action="javascript:goCalc('calcForm')" id="calcForm" name="calcForm">
<table align="center" border="0" cellpadding="3" cellspacing="1" width="100%">
<tbody>
<tr bgcolor="#bfd5ea">
<td style="font-size: 30px; color: f00; FONT-WEIGHT: bold; TEXT-ALIGN: center">
Donation:</td>
<td style="FONT-WEIGHT: bold; TEXT-ALIGN: center">
Tax Rate %:</td>
<td style="FONT-WEIGHT: bold; TEXT-ALIGN: center">
Net Cost of Donation</td>
<td style="FONT-WEIGHT: bold; color: 00f; TEXT-ALIGN: center">
Tax Savings</td>
</tr>
<tr bgcolor="#e6eef7">
<td align="middle" nowrap="nowrap" valign="center">
$
<input class="formtext" name="inputIncome" size="12">x</td>
<td align="middle" bgcolor="#e6eef7" nowrap="nowrap" valign="center">
<select class="formtext" id="inputPercentage" name="inputPercentage">
<option selected="selected" value="10">10%</option>
<option value="15">15%</option>
<option value="25">25%</option>
<option value="28">28%</option>
<option value="33">33%</option>
<option value="35">35%</option>
<option value="39.6">39.6%</option>
</select>=</td>
<td align="middle" valign="center">
$ <span style="FONT-WEIGHT: bold; TEXT-ALIGN: center"> <input class="formtext" id="inputCost" name="inputCost" readonly="readonly" size="12"> </span>
</td>
<td align="middle" valign="center">
$
<input class="formtext" id="inputMoney" name="inputMoney" readonly="readonly" size="12">
</td>
</tr>
<tr align="right">
<td nowrap="nowrap" valign="center">
</td>
<td nowrap="nowrap" valign="center">
<div align="center">
<input class="btn" name="Submit" type="submit" value="Calculate">
</div>
</td>
<td nowrap="nowrap" valign="center">
<div align="center">
</div>
</td>
<td nowrap="nowrap" valign="center">
</td>
</tr>
</tbody>
</table>
</form>
Issue is when user clicks the calculate tab, it does not display the other fields as coded... Tried everything, please help - (2) Readonly lines issue - in lower section of code - only need to display attributes of amount
Have you tried setting the cursor-eventsattribute on an inline css? Say
#inputMoney{
cursor-events: none;
}
or you can also try using the disabled='disabled' property though you have to enable thhose disabled elements before you submit the form
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.