HTML - Two-column Layout Not Working
This is both HTML and CSS-oriented.
Current CSS code pertaining to the layout: Code: #listnav { background: url('../images/listnav-bg.png') top left repeat-x; width: 25%; padding: 8px; float: left; } #content { width: 75%; padding: 8px; float: right; } #footer { } #main-wrapper { width: 85%; } HTML: HTML Code: <div id="main-wrapper"> <div id="listnav"> <!-- some spacer stuff here so i can actually see stuff (no static height set) --> </div> <div id="content"> <!-- some spacer stuff here so i can actually see stuff (no static height set) --> </div> </div> The result is that the listnav box shows up on the far right side and the content box shows up below it on the left hand side. Any ideas? :| Similar TutorialsI am very new to HTML and cant figure out why my 3-column layout isnt working. I cant seem to get my columns to line up side-by-side without overlapping ... HTML Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <!-- Created with the CoffeeCup HTML Editor 2006 --> <!-- http://www.coffeecup.com/ --> <!-- Brewed on 9/9/2010 12:48:26 PM --> <head> <title>Zone Map</title> <style type="text/css"> #head { position: relative; left: 0px; width: 250px; height: 20px; font-family: times new roman; line-height: 8px; font-size: 14pt; font-weight: normal; text-decoration: none; text-align: left; color: #c3bd24;} #content { left: 0px; width: 250px; font-family: times new roman; line-height: 16px; font-size: 10pt; font-weight: normal; text-decoration: none; text-align: left; color: #938461;} #dotted{ width: 225px; border-top: 2px dotted #c3bd24; } #container { width: 800px; } #col_right { position: relative; float: right; width: 250px; } #col_center { position: absolute; float: center; width: 250px; } #col_left { position: relative; float: left; width: 250px; } </style> </head> <body> <p align="center"> <img border="0" alt="" align="left" src="support/image/ZoneMap.png" width="650" height="400"><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br></p> <div id="container"> <div id="col_left"> <p id="head"><br>ZONE 1: $750 minimum</p> <div id="dotted"></div> <p id="content"> NJ*** all,<br> NY***Long Island to Islip,<br> MD** to Salisbury,<br> PA** Pittsburgh-Williamsport-Wilkes Barre,<br> VA** Richmond-Front Royal,<br> WV* to Martinsburg, Fairmont,<br> DE** all</p> </div> <div id="col_center"> <p id="head"><br>ZONE 2: $1,500 minimum</p> <div id="dotted"></div> <p id="content"> NY** Syracuse-Albany-Long Island,<br> CT** Hartford-New Haven,<br> PA** west of Pittsburgh-Erie,<br> OH** Sandusky-Columbus, Ashland,<br> VA** south of Richmond-Roanoke,<br> WV* south and west of Fairmont to Bluefield,<br> MA* Pittsfield-Buzzards Bay-Monomet</p> </div> <div id="col_right"> <p id="head"><br>ZONE 3: $2,500 minimum</p> <div id="dotted"></div> <p id="content"> VA** south and west of Roanoke,<br> TN***Chattanooga-Nashville,<br> KY** Hopkinsville-Madisonville,<br> IN***Evansville,<br> IL***Urbana, Chicago,<br> MI</p> </div> </div> </body> </html> So I found this perfect layout my mathew taylor and Im dissecting it to understand the layout and css. My first questions off the bat are, how does he get the links at the top to be indented? I cant see where he placed the command so that their is an inch of indent and then the links start. Also, how does he make it so the links at the top intersect with a black line the spans the header? I really dont see this in the html where the black line is. And lastly, if i want to create a banner for my website in the header how do i go about doing that in the space above the links and spanning the header. I really want to create a clean title in photoshop and place it there but I dont know what dimension width and heighth to use. Thanks http://matthewjamestaylor.com/blog/perfect-3-column.htm Hi guys, I have a problem. Whenever the left column is larger than the right column, it stretches the div, but the background doesn't go on. The content just flows out. Is there any way I can fix this? http://automata.firephoenixnet.com/74s/ Thanks in advance guys. HI all, Pretty new to web design and I was having some trouble centering my columns, or rather having my columns evenly space between each other in my wrap and from my warp borders. Also, I'm using a background image as my wrap border and for some reason there's a gap at the top and bottom of my pages. HMTL attached Any ideas? Thanks Hi! This is was my blog looks like at the moment: http://neverrgrowold.blogspot.com/ I would like to add a 3rd column to my 2 column layout. I know this will mean resizing the other two columns which I know how to do.. I just have no idea to add another column to the right. Here is the html: Code: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <title>Never Grow Old</title> <style type="text/css"> #navbar-iframe{height:0; visibility:hidden; display:none;} body {background-color: #000; font: normal 10pt Trebuchet MS; color: #e5e5e5; cursor: crosshair; line-height: 75%; scrollbar-face-color: #ddd; scrollbar-highlight-color: #fff; scrollbar-3dlight-color: #ddd; scrollbar-darkshadow-color: #ddd; scrollbar-shadow-color: #fff; scrollbar-arrow-color::#fff; scrollbar-track-color: :#ddd;} a:link, a:visited, a:active {color: #e5e5e5; text-decoration: none; text-transform: none; font: normal 8pt Trebuchet MS; cursor: normal;} a:hover {text-decoration: ; text-transform: None; font: normal 12pt Trebuchet MS; cursor: normal; color: #FF4C79;} blockquote {font: normal 8pt trebuchet ms; color:#e5e5e5; padding:5px; border-left:7px solid #ddd; background-color:#000;} blockquote:hover {-moz-border-radius:4px; padding:5px; border:2px solid #000; } blockquote:first-letter {background: #000; font: italic 15pt "Georgia"; color: #FF4C79;float: padding: 5px; text-transform: uppercase;} .head {text-align: center; font-family: impact; font-size:12pt; color:#CCFF66; text-align: left; text-transform: none; line-height: 9pt; font-style: none; background:#000; padding: 5px; } .content {font-size: 9pt; font-family: Trebuchet MS;color:#e5e5e5; background: #000; line-height: 14px; padding:10px; border: 2px solid #111; } .headline1{font:normal 30pt Courier New; color:#e5e5e5; letter-spacing:-3px; text-transform:uppercase; line-height:100%; } </style> <script type="text/javascript"> /*********************************************** * Disable select-text script- © Dynamic Drive (www.dynamicdrive.com) * This notice MUST stay intact for legal use * Visit http://www.dynamicdrive.com/ for full source code ***********************************************/ //form tags to omit in NS6+: var omitformtags=["input", "textarea", "select"] omitformtags=omitformtags.join("|") function disableselect(e){ if (omitformtags.indexOf(e.target.tagName.toLowerCase())==-1) return false } function reDisable(){ return false } if (typeof document.onselectstart!="undefined") document.onselectstart=new Function ("return false") else{ document.onmousedown=disableselect document.onmouseup=reDisable } </script> <script language=JavaScript> <!-- //Disable right click script III- By Renigade (renigade@mediaone.net) //For full source code, visit http://www.dynamicdrive.com var message=""; /////////////////////////////////// function clickIE() {if (document.all) {(message);return false;}} function clickNS(e) {if (document.layers||(document.getElementById&&!document.all)) { if (e.which==2||e.which==3) {(message);return false;}}} if (document.layers) {document.captureEvents(Event.MOUSEDOWN);document.onmousedown=clickNS;} else{document.onmouseup=clickNS;document.oncontextmenu=clickIE;} document.oncontextmenu=new Function("return false") // --> </script> <body> <div style="position: absolute; top: 10px; left: 188px; width: 500px;"> <span class="headline1"><img src="http://i44.tinypic.com/bfoq69.png"/> </span><br> </div> </div> <div style="position: absolute; top: 440px; left: 525px; width: 600px;"> <Blogger> <div class="head">@ <BlogDateHeader><$BlogDateHeaderDate$></BlogDateHeader> </div> <div class="content"><$BlogItemBody$></div><p> </Blogger> </div> <div style="position: absolute; top: 440px; left: 190px; width: 310px;"> <div class="head">Welcome! </div> <div class="content"> <div><img src="http://24.media.tumblr.com/avatar_66b2c19ef795_64.png" align="left" /><font color=#e5e5e5>I believe we never truly grow old unless we let ourselves. You'll find anything and everything to do with your childhood if yyou grew up anywhere between the late 80's to the early 2000's. So sit back, enjoy your stay, and take a trip down memory lane ;) </font></div> <p> </div><p> <div class="head">Memory Lane.</div> <div class="content"> ghghghghh </div><p> <div class="head">Support</div> <div class="content"> Place your tagobard here, <a href="http://cbox.ws">Cbox</a> recommended<BR> </div><p> <div class="head">Links</div> <div class="content"> Place all your links here,<br> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> <a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a> </div><p> <div class="head">Looking Backwards.</div> <div class="content"> <BloggerArchives> <BloggerArchives> <a href="<$BlogArchiveURL$>"> <$BlogArchiveName$></a> </BloggerArchives></a><br><br> </div><p> <div class="head">Credits</div> <div class="content"> Designer @<a href="http://www.blogskins.com/me/theomorphi-c">theomorphi-c</a>,<br> Basecode: <a href="http://www.blogskins.com/me/sacrificelove-">sacrifice</a><a href="http://love--bites.blogspot.com">love-</a><br> </div><p> </div> </body> I've been trying to figure it out with my basic html knowledge for a while now and I can't get it, I would be really appreciative if someone could help me out. Thanks!! Hello, I need to create a 3 -column lay out with the left and right columns having 200px each and the middle column take the rest. Here is my html markup: HTML Code: <div style="width: 100%"> <div style="width: 200px; float:left;">Left column</div> <div style="width: 100%; float:left;">Middle Column</div> <div style="width: 200px; float:left;">Right Column</div> </div> It's not working for me . Please help. Hi There, Pulling my hair out over this. For the life of me, cant make it work: http://www.cowboytuffwebsitedesign.c...cialdeals.html I've used positive padding negative margin to stretch both div's heights to match each other. But the content div, when needed to be higher than the menu div, will overflow its content past the container divs bg. As well the footer will only clear past the menu div, not the content div. HELP! PLEASE! I can copy and paste HTML right into the thread if needed. Thanks I am trying to create a very simple column like the on this website: http://www.vedicscholar.com/ I am specifically talking about the column with the heading 'Astrology Services'. I need it just like that & as of now, I don't need the underlines/link. I am aware of cellspacing & I tried real hard but wasn't able to get the desired result. Would appreciate a lot if someone helps, I will miss my only opportunity to earn if I can't do this. This is what I have done- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <style type="text/css"> div.services { width:180px; border:1px solid gray; margin-left:395px; margin-top:20px; padding-left:7px } div.onlyheading { background-color:#6495ed; } </style> </head> <div class="services"> <div class="onlyheading" >Services & Consultancy</div> <br /> Change your financial Destiny<br /> Advanced horoscope<br /> Marriage issues <br /> Career Problems <br /> Ask a Question </div> </body> </html> Hey all, http://www.lindesigns.us/rma/rmaonline.php If you go to that site on Firefox, the "Return Code #" expands. But if you use IE, you'll see that it doesn't. I could add a fix in there for the fields if they were static, but if you see my javascript, they are dynamically loading fields. This "class":"wide" is not working: Code: invoiceInput.appendChild(createElement("input", {"type":"text", "name":"invoice[]", "size":"8", "class":"wide;"})); I am using a script I found on a jQuery board (http://jsbin.com/acado/6), and it works for them, but not for me because my syntax is probably wrong. And they also are just using 1 field and not near-unlimited dynamically loading fields like I am. How would I add in a fix to have the browser 'only' use the expansion if the user is using IE6 or IE7? I searched on the boards but couldn't find the solution to this problem. Thanks in advance! Well, this is the first CSS layout i've made, the site right now is EXACTLY how I want it to look, but I think somethings not right... if I fill up where it says "How about some links? " too far, the footer goes to the top of the page, and the "Welcome" ends up in the navigation menu Here is the link Please view the thread here, as I am unable to copy it. E-mail any suggestions to sheehanmds@aol.com. Thank you! http://forums.htmlhelp.com/index.php?showtopic=8115 well im creating a new website layout but its being an ass...or its just me well its like 5am here in the UK now which is probebly the reason for the problem but ah well i need it sorting asap and i cant work it out. my website is http://www.rharris28.com so you can see for yourself. basicly everything apart from the bar at the bottom should be on one line, but it just wont do it. i refuse to use tables as ive broken that habbit and want to stear clear of tables at all costs. so its all div's and css work. my html is HTML Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> <html> <head> <title>Mixing Pixels - Internet Services :: Homepage</title> <link rel="stylesheet" type="text/css" href="style.css"> <meta name="verify-v1" content="KY6WP1pcuAyddeAyjc4oFZVeQDE0qbbA1GGcJ2Zgu8Y=" /> </head> <body> <div id="background" align="center"> <div id="container" align="left"> <div id="tb"> <div id="tbbg"></div> <div id="topsep"></div> <div id="tophome"></div> <div id="topsep"></div> <div id="topmap"></div> <div id="topsep"></div> <div id="topcontacts"></div> <div id="topsep"></div> <div id="searchbg"><b>Search:</b></div> </div> <div id="topmenu"> <div id="topmenubg">Home</div> <div id="topmenusep"></div> <div id="topmenubg">News</div> <div id="topmenusep"></div> <div id="topmenubg">Downloads</div> <div id="topmenusep"></div> <div id="topmenubg">Search</div> <div id="topmenusep"></div> <div id="topmenubgend">Services</div> </div> </div> </div> </body> </html> and my CSS is Code: * { margin: 0; padding: 0; } #background { background-color:#01557C; height: 100%; width: 100%; } #container { background-color:#FFFFFF; width: 759px; height:500px; } #tbbg { background-image:url(/images/main01.jpg); width:256px; height:41px; } #tb { float:left; width:759px; } #tophome { background-image:url(images/but_home.gif); width:74px; height:41px; } #topmap { background-image:url(images/but_site_map.gif); width:94px; height:41px; } #topcontacts { background-image:url(images/but_contacts.gif); width:96px; height:41px; } #topsep { background-image:url(images/separator.gif); width:2px; height:41px; } #searchbg { width: 231px; height: 41px; background-image:url(images/fon01.gif); } #topmenu { width:759px; } #topmenubg { background-image:url(images/fon_menu.gif); width:132px; height:42px; float:left; text-align:center; } #topmenubgend { background-image:url(images/fon_menu.gif); width:135px; height:42px; float:left; } #topmenusep { background-image:url(images/e_menu.gif); width:24px; height:42px; float:left; } please help...many thanks Hi...I'm having trouble with 2 things right now with my website. First of all, I want to create a new column on the right side of my webpage. And second of all, I want to make my website container a bit wider. Could someone use firebug and tell me how to do this? Here, is my website: http://www.2teachreading.comyr.com Thanks in advance hi, i have a table, i freezed(locked) the first column and firs row of the table.whilw scrolling down, the freezed(locked) column camouflages the freezed row.but i don't want this.i want the freezed row to caoumaflage the freezed column.do you have any ideas? Regards. How can I put a blue border round this entire column. I tried but can't get it to work. http://www.bestsellersworld.com/text2.html I don't know if this is supposed to be posted here or in the css forum - so correct me if I'm doing it wrong. I'm making a table with a variable number of colums. The first column should be allowed to have a width of 30 % if it is needed by the text, but less if it is not needed. (This can style="max-width:30%" do for me). The rest of the columns can use the space that the first columns doesn't use, but shouldn't be able to force the first column to be smaller. If I use max-width the first column might be smaller than 30% because of the rest of the columns forces it to be so, and if I use width=30% the width will be 30% even if the text in the first column doesn't need 30%. Can anyone help me? Hi all, I'm trying to achieve a border around columns, like on this website: http://www.birchandbird.com I like the blue textured border around the columns but I'm completely stuck on how I achieve that. Can anyone please help me? Thank you so much in advance! i tried a code for left right side by side columns but it didn't work can somebody give me a clue to why this didn't work? <style> #columns { width:600px;} #columns.column{ position:relative; width:46%; padding:1%; boarder: solid 1px #000;} #columns:left;{ float:left;} #ciolumns:right{ float:right} </style> <div id="columns"> <div class="left column"> <p>text here</p> </div> <div class="right column"> <p>text here</p> </div> </div> Hi, I'm trying to create a two column form, but the following approach isn't working the way I would like. (when tabbing through, once finished the left column, it submits the form). I'd like to lay it out in css but not sure how. Any help is greatly appreciated! Code: <table width="100%" border="0" cellspacing="0" cellpadding="0" id="tblQuote"> <tr> <td valign="top"><p onfocus="MM_validateForm('fldComp','','R','fldEmail','','RisEmail','fldOrg','','R','fldDest','','R','fldProd','','R','fldWgt','','R','fldCharge','','R','fldDate','','R','fldDouanes','','R');return document.MM_returnValue">Compagnie<br /> <input name="fldComp" type="text" class="input" id="fldComp" accesskey="1" tabindex="1" size="30" /> <br /> Courriel<br /> <input name="fldEmail" type="text" class="input" accesskey="2" tabindex="2" title="Email" size="30" /> </p> <p><br /> Origine<br /> <input name="fldOrg" type="text" class="input" id="fldOrg" accesskey="3" tabindex="3" size="30" /> <br /> <br /> Destination<br /> <input name="fldDest" type="text" class="input" id="fldDest" accesskey="4" tabindex="4" title="Email" size="30" /> </p> <p><br /> Produits<br /> <input name="fldProd" type="text" class="input" id="fldProd" accesskey="5" tabindex="5" size="30" /> <br /> <br /> Poids<br /> <input name="fldWgt" type="text" class="input" id="fldWgt" accesskey="6" tabindex="6" title="Email" size="20" /> <select name="fldWeightType" id="fldWeightType"> <option value="Kg." selected="selected">Kg.</option> <option value="Lbs.">Lbs.</option> </select> </p> <p> </p> <p onfocus="MM_validateForm('fldComp','','R','fldEmail','','RisEmail','fldOrg','','R','fldDest','','R','fldProd','','R','fldWgt','','R','fldCharge','','R','fldDate','','R','fldDouanes','','R');return document.MM_returnValue">Division<br /> <label> <input type="radio" name="fldOuv" value="Yes" tabindex="7" accesskey="7" /> Remorques ouvertes</label> <br /> <label> <input type="radio" name="fldFerm" value="No" tabindex="8" accesskey="8" /> Remorques fermées</label> <br /> <label> <input type="radio" name="fldMar" value="No" tabindex="9" accesskey="9" /> Conteneurs maritimes</label> </p> <p> </p></td> <td valign="top"><p>Charge entière <label> <br /> <input type="radio" name="fldChargeRadio" value="Yes" tabindex="11" accesskey="11" /> Oui </label> <br /> <label> <input type="radio" name="fldChargeRadio" value="No" accesskey="12" tabindex="12"/> Non</label> <br /> </p> <p>*si non indiquer %<br /> du chargement<br /> <input name="fldCharge" type="text" class="input" id="fldCharge" accesskey="13" tabindex="13" size="30" /> </p> <p> </p> <p onfocus="MM_validateForm('fldComp','','R','fldEmail','','RisEmail','fldOrg','','R','fldDest','','R','fldProd','','R','fldWgt','','R','fldCharge','','R','fldDate','','R','fldDouanes','','R');return document.MM_returnValue">Date de livraison <br /> <input name="fldDate" type="text" class="input" id="fldDate" accesskey="14" tabindex="14" title="Email" size="30" /> </p> <p onfocus="MM_validateForm('fldComp','','R','fldEmail','','RisEmail','fldOrg','','R','fldDest','','R','fldProd','','R','fldWgt','','R','fldCharge','','R','fldDate','','R','fldDouanes','','R');return document.MM_returnValue"> </p> <p>Heure de rendez-vous<br /> <input name="fldTime" type="text" class="input" id="fldTime" accesskey="15" tabindex="15" size="30" /> <br /> <br /> Personne ressources<br /> <input name="fldRes" type="text" class="input" id="fldRes" accesskey="16" tabindex="16" title="Email" size="30" /> </p> <p> </p> <p>Courtier en douanes<br /> <input name="fldDouanes" type="text" class="input" id="fldDouanes" accesskey="17" tabindex="17" size="30" /> <br /> <br /> Informations pertinentes<br /> <textarea name="fldComments" cols="30" rows="10" class="input" id="fldComments" accesskey="18" tabindex="18"></textarea> </p> <p> <input type="submit" name="Submit" value="Envoyer" accesskey="19" tabindex="19" /> </p></td> </tr> </table> I have a Web Page with a Form on it. How/where can I add a left hand column that will run all the way down the left side? Here is the page code, and I've attached an image of what it looks like now. Thanks. Code: <?php global $account; ?> <link href="../style.css" rel="stylesheet" type="text/css" /> <style type="text/css"> <link href="../style.css" rel="stylesheet" type="text/css" /><style type="text/css"></style> <table> <table cellpadding="0" width="770" height="100%" cellspacing="0" bgcolor="#FFFFFF" style="border-right: solid 1px #6b6b6b"> <form method="POST" action="index.php"> <td width="140" rowspan="21" id="menu"> </td> <td> </td> <input class='field' type='hidden' name='command' value='account'> <input class='field' type='hidden' name='param' value='signup'> <tr> <td class='pageTitle'><span class="hLine"> <font face="Arial" color=#A30100" size="3" Style="padding-left: 50px;"> <b>Create New Account</b></span></td> <td class='pageTitle'> </td> </tr> <tr> <td class='fieldLabel' width="30%"> <font face="Arial" color=#000000" size="2" Style="padding-left:50px;"> Membership Type</td> <td align="right">[account_type_panel]</td></tr> <tr> <tr> <td class='fieldLabel' width="30%"> <font face="Arial" color=#000000" size="2" Style="padding-left:50px;"> Email Address</td> <td><input class='field' type='text' size='35' maxlength="30" name='user_name' value='<?=$account->user_name ?>'> <span class='requiredField'>* </span><br> <span class='errorMessage'><?=$account->get_error('user_name') ?></span></td> </tr> <tr> <td class='fieldLabel'><font face="Arial" color=#000000" size="2" Style="padding-left: 50px;"> Re-Confirm Email Address</td> <td><input class='field' type='text' size='35' maxlength="50" name='email' value='<?=$account->email ?>'> <span class='requiredField'> * </span><span class='errorMessage'><?=$account->get_error('email') ?></span></td> </tr> <tr> <td> </td></tr> <tr> <td class='fieldLabel'><font face="Arial" color=#000000" size="2" Style="padding-left: 50px;"> Password</td> <td><input class='field' type='password' size='35' maxlength="30" name='password' value='<?=$account->password ?>'> <span class='requiredField'> * </span><span class='errorMessage'><?=$account->get_error('password') ?></span></td> </tr> <tr> <td class='fieldLabel'><font face="Arial" color=#000000" size="2" Style="padding-left: 50px;"> Re-Enter Password</td> <td><input class='field' type='password' size='35' maxlength="30" name='reenter_password' value='<?=$account->reenter_password ?>'> <span class='requiredField'> * </span><span class='errorMessage'><?=$account->get_error('reenter_password') ?></span></td> </tr> <tr> <td> </td></tr> <tr> <td class='fieldLabel'><font face="Arial" color=#000000" size="2" Style="padding-left: 50px;">First Name </td> <td ><input class='field' type='text' size='35' maxlength="50" name='first_name' value='<?=$account->first_name ?>'> <span class='requiredField'> * </span><span class='errorMessage'><?=$account->get_error('first_name') ?></span></td> </tr> <tr> <td class='fieldLabel'><font face="Arial" color=#000000" size="2" Style="padding-left: 50px;"> Last Name</td> <td><input class='field' type='text' size='35' maxlength="50" name='last_name' value='<?=$account->last_name ?>'> <span class='requiredField'> * </span><span class='errorMessage'><?=$account->get_error('last_name') ?></span></td> </tr> <tr> <td> </td></tr> <tr> <td class='fieldLabel'><font face="Arial" color=#000000" size="2" Style="padding-left: 50px;"> Address</td> <td><input class='field' type='text' size='35' maxlength="70" name='address' value='<?=$account->address ?>'> <span class='requiredField'> * </span><span class='errorMessage'><?=$account->get_error('address') ?></span></td> </tr> <tr> <td class='fieldLabel'><font face="Arial" color=#000000" size="2" Style="padding-left: 50px;"> Address 2</td> <td><input class='field' type='text' size='35' maxlength="70" name='address_second' value='<?=$account->address_second ?>'></td> </tr> <tr> <td class='fieldLabel'><font face="Arial" color=#000000" size="2" Style="padding-left: 50px;"> City</td> <td><input class='field' type='text' size='35' maxlength="50" name='city' value='<?=$account->city ?>'> <span class='requiredField'> * </span><span class='errorMessage'><?=$account->get_error('city') ?></span></td> </tr> <tr> <td class='fieldLabel'><font face="Arial" color=#000000" size="2" Style="padding-left: 50px;"> State/Province</td> <td><input class='field' type='text' size='35' maxlength="35" name='phone' value='<?=$account->phone ?>'><span class='requiredField'> * </span></td> </tr> <tr> <td class='fieldLabel'><font face="Arial" color=#000000" size="2" Style="padding-left: 50px;"> Zip/Postal Code</td> <td><input class='field' type='text' size='35' maxlength="35" name='zip_postal_code' value='<?=$account->zip_code ?>'> <span class='requiredField'> * </span><span class='errorMessage'><?=$account->get_error('zip_code') ?></span></td> </tr> <tr> <td class='fieldLabel'><font face="Arial" color=#000000" size="2" Style="padding-left: 50px;"> Country</td> <td><input class='field' type='text' size='35' maxlength="35" name='mobile_phone_number' value='<?=$account->mobile_phone_number ?>'> <span class='requiredField'> * </span></td> </tr> <td> </td></tr> <tr> <td class='fieldLabel'><font face="Arial" color=#000000" size="2" Style="padding-left: 50px;"> I Have Read and Agree With The <A href='legal.php'><font color=#000000" size="2";"><u>Terms & Conditions</u></a></td><td><input type="checkbox" name="terms" value="true"><span class='requiredField'> * </span></td> </tr> <tr> <td> </td></tr> <tr> <td> </td></tr> <tr><td class='hLine' align="right"> </td> <td class='hLine' align="right"> <span class='requiredField'> * </span><font color="red"> Required Field</font></span></td> </tr> <tr><td align="right"> </td> <td align="right"><input name="submit" type='submit' class='button' value='create' /></td> </tr> <tr><td> </td> <td> </td> </td> </form> </table> |