HTML - Tables & Forms Closing Tag
Hi.
I know this is fairly simple but havn't found a fix elsewhere. I created this form but can't close it. I'm guessing its to do with the table? Everytime i but a </form> tag in it either wont submit the form or screws up formatting. Any ideas. Thanks. Code: <table width="681" border="0" class="style26"> <tr> <td colspan="5" valign="middle"><p>My name is:<br> </p> </td> </tr> <tr> <td width="8" valign="middle"> </td> <td width="90" valign="middle"><span class="style30">given name(s)<br> </span></td> <td width="170" valign="middle"> <form action="lostform.php" method="post" name="form1"> <span id="sprytextfield1"> <label> <input type="text" name="gname" id="fname"> </label> </span> </form> </td> <td width="67" valign="middle" class="style30">surname</td> <td width="324" valign="middle"><span class="style30" id="sprytextfield2"> <label> <input type="text" name="sname" id="sname"> </label> </span><br></td> </tr> <tr> <td valign="middle"> </td> <td valign="middle">My email is:</td> <td colspan="3" valign="middle"><span id="sprytextfield3"> <label> <input type="text" name="email" id="email"> </label> <span class="textfieldRequiredMsg">A value is required.</span><span class="textfieldInvalidFormatMsg">Invalid format.</span></span><br> <br></td> </tr> <tr> <td colspan="3" valign="middle">My date of purchase was:</td> <td colspan="2" valign="middle"><span id="spryselect1"> <label> <select name="day" size="1" id="day"> <option selected>01</option> <option>02</option> <option>03</option> <option>04</option> <option>05</option> <option>06</option> <option>07</option> <option>08</option> <option>09</option> <option>10</option> <option>11</option> <option>12</option> <option>13</option> <option>14</option> <option>15</option> <option>16</option> <option>17</option> <option>18</option> <option>19</option> <option>20</option> <option>21</option> <option>22</option> <option>23</option> <option>24</option> <option>25</option> <option>26</option> <option>27</option> <option>28</option> <option>29</option> <option>30</option> <option>31</option> </select> </label> <span class="selectRequiredMsg">*</span></span> <span id="spryselect2"> <label> <select name="month2" size="1" id="month"> <option>JAN</option> <option>FEB</option> <option>MAR</option> <option>APR</option> <option>MAY</option> <option>JUN</option> <option>JUL</option> <option>AUG</option> <option>SEP</option> <option>OCT</option> <option>NOV</option> <option>DEC</option> </select> </label> <span class="selectRequiredMsg">*</span></span> <span id="spryselect3"> <label> <select name="year" size="1" id="year"> <option>1998</option> <option selected>1999</option> <option>2000</option> <option>2001</option> <option>2002</option> <option>2003</option> <option>2004</option> <option>2005</option> <option>2006</option> <option>2007</option> <option>2008</option> </select> *</label><span class="selectInvalidMsg"></span> </span><br></td> </tr> <tr> <td colspan="3" valign="middle">My Receipt Number was:</td> <td colspan="2" valign="middle"><span id="sprytextfield4"> <label> <input name="rcpt" type="text" id="rcpt" size="10" maxlength="8"> </label> <span class="textfieldRequiredMsg">A value is required.</span><span class="textfieldMinCharsMsg style32 style32">Invalid: Please check your receipt number</span><span class="textfieldMaxCharsMsg style32 style32">Invalid: Please check your receipt number.</span></span><br></td> </tr> <tr> <td colspan="3" valign="middle"><br> Other Comments:</td> <td colspan="2" valign="middle"> </td> </tr> <tr> <td valign="middle"> </td> <td colspan="4" valign="middle"><span id="sprytextarea1"> <label></label> <span class="textareaRequiredMsg">A value is required.</span></span> <div align="center"> <textarea name="message" id="message" cols="45" rows="5"></textarea> </div></td> </tr> <tr> <td> </td> <td colspan="4"><label> <input type="submit" name="submit" id="submit" value="Submit"> </form> <div align="center"></div> </label></td> </tr> </table> Similar TutorialsTrying to get this code to look like the attached photo; what am I missing? Specifically wondering about the alignment of the labels next to the buttons and text boxes, but any other suggestions would be greatly appreciated. Thanks! Code: <?xml version="1.0" encoding="UTF-8"?> <!-- DOCTYPE tag to declare XHTML 1.0 Transitional --> <!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" xml:lang="en" lang="en"> <!-- Head section containing title, and meta tags for author and editing program --> <head> <title>Lab 7</title> <meta name="Marc" content="CSE HTML Validator Professional (http://www.htmlvalidator.com/)" /> </head> <!-- Body tag with bgcolor, background image, and text, link, vlink, and alink color --> <body bgcolor="white" background="\images\background.jpg" text="black" link="#0000FF" vlink="#FF00FF" alink="#00FF00"> <h1 align="center">Registration Form</h1> <form action="..."> <table width=80% bgcolor="00b2e2"> <tr align="left"> <td width="20%" colspan="4"><u><b>Student Information</b></u></td> </tr> <tr align="center"> <td width="20%" colspan="4" align="left">Student ID: <input type="text" name="studentid" id="studentid" /></td> </tr> <tr align="left"> <td width="20%"> Title:<input type="radio" name="Mr." align="right" />Mr.<br /> <input type="radio" name="Mrs." align="right" />Mrs.<br /> <input type="radio" name="Miss" align="right" />Miss<br /> <input type="radio" name="Ms." align="right" />Ms. </td> <td align="left">First Name: <input type="text" name="firstname" id="firstname" /></td> <td align="left">Last Name: <input type="text" name="lastname" id="lastname" /></td> <td></td> </tr> <tr align="left"> <td>Address:<br /><input type="text" name="address" id="address" /></td> </tr> <tr align="left"> <td>City: <input type="text" name="city" id="city" /></td> <td>State: <input type="text" name="state" id="state" /></td> <td>ZIP: <input type="text" name="zip" id="zip" /></td> <td width="20%"></td> </tr> </table> </form> </body> </html> I was looking to compare business cards, when I came across this website (I don't own the site, and I'm not trying to market it): http://www.goodmarketingideas.com/to...rds/comparison When you use the form, the one labeled "Comparison Price Calculator", the table on the page changes to show different prices, based on how many business cards you want. I checked the source code, and from what I can see, it's a basic form with nothing special to it. How is this done? I want to mimic this effect, but I can't find any information on how to do this. Any help would be greatly appreciated, thanks. I apologize if this is in the wrong forum. Please move it to the proper location if needed. Here's the situation: I need a page with 2 fixed frames, small top, rest bottom. In the top frame, I need a few form text fields and a submit button. In the bottom frame, I need the information that was typed into the text fields above to populate the bottom frame. Everytime I enter new info and hit submit, I want the information to be added to the bottom frame and to the information that was already added. I'm new to this, but am a quick learner and willing to spend enough time to do this myself with guidance. Thanks Hi guys, I've been frustrated for awhile trying to fix three of my problems. I just started making a site for myself today, the specific one is http://www.bcsticketsnow.com/rosebowl.html Anyway, I've got three problems, and appreciate any help anyone can offer on any of them: 1. I'm new to frames, and am told to stay clear of it. But I don't know php, so this is the only way I know to make a header, middle and footer on all 20 pages that I'm going to have where I only need to edit one to change all. So I have 3 frames in the frameset, header, mainrosebowl, and footer. I understand that cols="220,*,100" will make the header 220 pixels, the footer 100 px, and the middle part the rest of the window. But I'm trying to figure out a way to have it go deeper than the window. As you can tell, I've got a scroll bar on that middle frame. I want that frame to extend to more than 100% and push the footer below the visible window. So I'm really looking for a big scroll bar for the entire window to scroll down, not a mini scroll bar just for the middle frame. Is this possible? Having the cols add up to only the size of the window isn't what I'm looking for. 2. In the header frame, I've got that drop down menu (says "Bowl Events"). When I put the form in for the drop down menu, it kind of expanded the height of the table. It had less space before in that row of the table with the blue background. When I put the form in there, it kinda messed up the spacing. I essentially want to delete that space below bowl events to make the height of the row of that table like half the size. Any ideas? 3. For that same drop down menu, I'm trying to target each link in that menu to open up a new window (like target="_top"). But putting it after <option value="URL" target=..."> does nothing. Am I supposed to put it in the javascript? Here's what I have now: <script type="text/javascript"> function goToPage(dd) { var ind = dd.selectedIndex; if (ind == 0) { return; } var url = dd.options[ind].value document.location=url; } </script> <form> <select name="eventlist" onChange="goToPage(this); return false;" size="1" style="border: 0; BACKGROUND: navy; COLOR: white; FONT-FAMILY: arial; FONT-SIZE: 15px; font-weight: bold;"> <option value="">Bowl Events</option> <option value="http://www.bcsticketsnow.com/bcschampionship.html" onclick="header.location.href='_top'">BCS Championship</option> <option value="http://www.bcsticketsnow.com/rosebowl.html">2009 Rose Bowl</option> <option value="http://www.bcsticketsnow.com/orangebowl.html">2009 Orange Bowl</option> <option value="http://www.bcsticketsnow.com/fiestabowl.html">2009 Fiesta Bowl</option> <option value="http://www.bcsticketsnow.com/sugarbowl.html">2009 Sugar Bowl</option> <option value="http://www.bcsticketsnow.com/chickfilabowl.html">2009 Chick-Fil-A Bowl</option> <option value="http://www.bcsticketsnow.com/capitalonebowl.html">2009 Capital One Bowl</option> <option value="http://www.bcsticketsnow.com/cottonbowl.html">2009 Cotton Bowl</option> <option value="http://www.bcsticketsnow.com/holidaybowl.html">2009 Holiday Bowl</option> </select></form> I have a small window that shows site logins by ip address. I open it with window.open and get exactly the proper display in the proper position. But, I'm stuck with the browser page that called window.open(). Is there a way to close that browser? I've tried things like window.opener.close() with no luck. Remember, I want t close the browser, not just a window. Thanks, Mac must be a dumb question but my book dont say how when you want to simply have a link to say "close this window" ie for dummies that dont know to goto the big X up top, what it the code?? Hi. I am wondering if there is any way of opening/closing an object in HTML or CSS or Javascript? For example, I have a Chat Box that is floating on the bottom left of the screen, I want to be able to close it if I don't want to see it, and if i want to open it up again, I would do so. If anyone can help, it would be greatly appreciated! Thanks, Chris I am currently running this code. This web page has 3 things on it, when viewed: Choose A Transaction Transction Type and the button: Next And these things all have over an inch of space between them. Can you please help me close the gaps between the lines Choose A Transaction and Transaction Type. And can you please help me close the gap between Tansaction Type and "next" icon? Thank you. Code: <table width='770' border='0' cellpadding='0' cellspacing='0' id='maintable' align='center' valign='top' align='left' margin=0 padding=0 width='770' height='500' table style='background-color:#ffffff; font-family:Arial, Helvetica, sans-serif; width:'770' height:'500'></td> <link href='custom.css' rel='stylesheet' type='text/css'> <td id='menu' align='left' valign='top' rowspan='500' width='164'> <br> <img src='images/bullet.gif' alt='' width='10' height='10'><a href='index.php'><font color='#DDCEA2'><font face='Arial' size='2'>Home</a></font><br></a> <form method="POST" action="index.php"> <input class='field' type='hidden' name='command' value='account'> <input class='field' type='hidden' name='param' value='renew'> <input class='field' type='hidden' name='account_id' value='[account_id]'> <td colspan='2' class='pageTitle'><div class='hLine' display:inline;><font face="Arial" color="#EE7600" size="3"> Choose a Transaction</font></div></td> <tr><td class='fieldLabel' width="30%"><font face="Arial" color=#000000" size="3" Style="padding: 5px;"> <font face="Arial" color="#000000" size="3"> Transaction Type:</font><!--</td>--> <td align="left"><font face="Arial" color="#EE7600" size="2">[account_type_panel]</font></td> <tr><td align="center"></td> <td align="left"><input name="submit" type='submit' class='button' value='Next' /></td> </tr> </form> <tr height='30%' ><div class='hLine'display:inline;></div></td></tr> </table> I understand that external CSS is great and a better choice, however, I am using a script that has many functions I need and is written this way. So I just want to finish up with what I have , instead of re-write this script. An "in-line css" suggestion worked fairly well except that I have a gap between the white background and the Header, and the white background and the Footer. Can someone help me eliminate this gap so the white background extends all the way to the Header and Footer, please? Here is the code, and I've attached an image for visual aid. Thanks! Code: <table style="background-color:#ffffff; font-family:Arial, Helvetica, sans-serif; width:200%"> <td align="left" valign="top"><font face="Arial" color="#000000" size="4"><b>text text text text text text text </b><br><font face="Arial" color="#990000" size="4"><b>TEXT TEXT TEXT TEXT TEXT TEXT TEXT </b></font><br> <font color="#FF9900">______________________________</font><br> <font face="Arial" color="#6B6B6B" size="3">Text Text Text text.<br><font face="Arial" color="#000000" size="3">TEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXTTEXT TEXT TEXT TEXT TEXT TEXT</font><br> </td></tr> </table> I have a web page that has a gap between the main content page (lower) and the header piece(upper) and I can't figure out how to close this gap. If you're interested in taking a look at it. Here's the code and i've attached an image for a visual aid. Thanks. Code: <table width='770' border='0' cellpadding='0' cellspacing='0' id='maintable' align='center' table valign='top' align='left' cellpadding='0' width='770' height='500' table style='background-color:#ffffff; font-family:Arial, Helvetica, sans-serif; width:'770' height:'500'></td> <link href='custom.css' rel='stylesheet' type='text/css'> <td id='menu' align='left' valign='top' rowspan='500' width='165'> <br> <img src='images/bullet.gif' alt='' width='10' height='10'><a href='index.php'><font color='#DDCEA2'><font face='Arial' size='2'>Home</a></font><br> <img src='images/bullet.gif' alt='' width='10' height='10'><A href='index.php?command=signup_page'><font color='DDCEA2'><font face='Arial' size='2'>Sign Up</font></A> <br> <img src='images/bullet.gif' alt='' width='10' height='10'><a href='faq.html'><font color='DDCEA2'><font face='Arial' size='2'>FAQ</a><br> <img src='images/bullet.gif' alt='' width='10' height='10'><a href='legal.html'><font color='DDCEA2'><font face='Arial' size='2'>Terms of Use<br></a> <form method='POST' action='index.php'> <input class='field' type='hidden' name='command' value='account'> <input class='field' type='hidden' name='param' value='signup'> </form> <tr><td> </td></tr> <td valign=top colspan='2' class='pageTitle'><div class='hLine'><b> <font face='Arial' color='#EE7600' size='3'>Select The Payment Button Below To Continue</b></font></div></td></tr> <td class='fieldLabel' width='30%'> <font face='Arial' color='#A30100' size='2'><b>Transaction Type:</b></font></td> <td align='left' class='text' ><b>[account_type_title]</b></td> </tr> <tr> <td class='fieldLabel' width='30%'> <font face='Arial' color='#A30100' size='2'><b>Price:</b></font></td> <td align='left' class='text' ><b>$ [price]</b></td> </tr> <tr> <td class='fieldLabel' width='30%'> <font face='Arial' color='#A30100' size='2'><b>Subscription Period:</b></font></td> <td align='left' class='text' ><b><font face='Arial' color='#000000' size='2'>[period]</b> (month)</font></td></tr> <tr valign='top' height='55px' '> <td valign='top' class='fieldLabel' width='30%'> </td> <td valign='top'> <p><font face='Arial' color='#000000' size='2'>[payment_code]</font></p></td> </tr> <tr><td> </td></tr><tr><font face='Arial' color='#000000' size='2'></font> <tr height='30%' ><td colspan='2'><div class='hLine'> </div></td></tr> </table For as long as I've been validating web pages, I never realized that the closing </head> tag was optional in HTML. I feel as if I've missed the boat at times. While I'm all for trimming excess code, I just cannot for the life of me strip out closing tags because they are optional in HTML. I'd be concerned that something, somewhere would not parse the document correctly if I removed the closing </head> element. Are my concerns unfounded? For as long as I've been validating web pages, I never realized that the closing </head> tag was optional in HTML. I feel as if I've missed the boat at times. While I'm all for trimming excess code, I just cannot for the life of me strip out closing tags because they are optional in HTML. I'd be concerned that something, somewhere would not parse the document correctly if I removed the closing </head> element. Are my concerns unfounded? For as long as I've been validating web pages, I never realized that the closing </head> tag was optional in HTML. I feel as if I've missed the boat at times. While I'm all for trimming excess code, I just cannot for the life of me strip out closing tags because they are optional in HTML. I'd be concerned that something, somewhere would not parse the document correctly if I removed the closing </head> element. Are my concerns unfounded? Ok, I'm working on a website and I need to put in a text field where someone can effectively leave "updates" and little notes. The site will be saved on a network and used by multiple computers so I'm hoping it can be done without have to make multiple CSS files. So far so good. Essentially I want one computer to be able to type in text and close the window. Then I want to be able to open it up on another computer and still see that text. So far all that's happened is the text resets to a blank field after it's closed, which I expected, I just don't know how to fix it lol I'm using IE and not Firefox. For some reason, on my homepage (http://www.projectdisobey.com/disobeyclothing/) an extra '</div> <!-- content #end -->' is being created in the page source, AFTER the closing 'body' and 'html' tags. There is no mention of '</div> <!-- content #end -->' in my 'footer.php' file, so why does this show up in the page source? Please see the attachment. If anybody could point me in the right direction as to why this might be occurring, and how I might fix it, I would be eternally grateful! Thanks! Hi Normally, when you have more than one table in your code, the tables will be placed one under each other. Example: <table> ... </table> <table> ... </table> When you want the tables to be placed next to each other, you need to set the align attribute. Example: <table align="left"> ... </table> <table align="left"> ... </table> BUT: When you do it like in the 2nd example (tables next to each other), in Firefox, the tables will wrap to a new line if there is no more space. In Internet Explorer, the tables will not wrap. The result is a horizontal scrollbar or "hidden tables". Why this? How can I make the tables wrap also in Internet Explorer as it does in Firefox? Is it possible with a special CSS definition or with a special DIV/SPAN tag? Thanks for your help praiser Hey everyone, I'm new to these boards. Somewhat a newbie at web design, but I know basics. I'm looking to put 2 tables adjacent to each other inside another table. My problem is I can't get the tables to line up the way I want them to. I'll post a picture of how I want it to look, how it looks now and my code. How I want it to look: How it looks now: I want the tables to line up at the top and re-size according to each other so they're always aligned at the top. Code: coming in next 2 posts I have a question about this new: HTML Code: <meta charset="UTF-8"> thing, introduced in HTML 5. Why it's not self-closing tag? I don't understand it, I think it should be: HTML Code: <meta charset="UTF-8" /> Can anyone explain it to me? Hi all. Working on some php program, i tried to get the things tidy in my HTML code. So what I did is something like this : Code: <div id="something"> ... some php code and stuff ... </div id="something"> It seems to work, not even a warning with the firefox extension to validate HTML. So I'm wondering. Are closing tags not parsed farther than the word following the '/' ? As I have not tested it on other browsers, do you think it's safe to keep it like this ? I browsed the HTML 4.01 reference, not found a line about the way closing tags may be treated. I still think it's a very good way for me to debug/find my toes in a long HTML file, only need a regexp to have my whole <div> element, no more eye killing research counting the </div>s. But I'm afraid some browsers reject these closing tags. Any advice ? Thanks. Guillaume |