HTML - Problem With Nesting Of Table Html.
Hi All,
I am newbie with HTML, I am having difficulties in nesting the tables. I have 4 <TD> tags in a <Table> but somehow due to some nesting issues when i am inserting a table in my 3rd <TD> my 4th <TD> goes out of the table. Here goes my Code... ------------------------------------------------------------------------------------------------------- <HTML> <BODY> <table border=1 width="100%"> <tr> <td>1st TD</td> <TD>2nd TD</td> <td>3rd TD <table> <tr> <table> <tr> <td>Info</td> <td>S/O</td> </tr> <tr> <td><select><option>Info about Renting</option></select></td> <td><input type="text" style="width:70px"></td> </tr> <tr> <table width="50%"> <td></td> <td>ABC</td> <td>DEF</td> <td>GHI</td> <td>JKL</td> </table> </tr> <table> </tr> </table> </td> <td>4th TD</td> </tr> </table> </BODY> </HTML> -------------------------------------------------------------------------------------------------------- Please Help!!!... -Gagan Similar TutorialsHello, I've been looking at this problem for a few hours now and can't see what i'm doing wrong. I just want to nest 2 tables inside 1 row of another table. Problem can be seen and you can view source at http://www.lakesdt.com/testindex.html Can anyone tell me where i've gone wrong? I'm using Notepad++ so that can confirm all my <tr> and <td>'s seem to match up. Any help much appreciated! Also open to suggestions for a better way to implement this, and also as each link on the left will load a page in the right is there a neater way to do this without reloading the whole page again? Best regards, Matt I have a table which contains 1 row, and 2 cells within the row. One cell displays some text neatly centered. and the other an image. I've written some javascript to change the color of the cell when the mouse hovers above it. Nice...but How do I nest my table inside an anchor <a href=""> tag so that the visitor can click anywhere within the cell and be directed to the href? Ive nested the table inside a tag and it only worked in Mozilla & Opera, but Internet Explorer......need I say more? Please help? I've only been using HTML for a couple of weeks, so apologies if this is a silly question. My website has quite a few common parts (eg menu line and footer), and the way I've currently got it set up these are defined on every page, so any change has to be edited into every page. What I would like to be able to do is define my menu in a separate file and have each HTML page reference it. That way I can just change the one file and that will be reflected in each HTML page. Does that make sense ? I know that I could use frames, but would prefer to do it this way if possible. Thanks We probably all know that if we run our HTML through the W3C validator, it will inform us if we've illegally nested one element inside another (e.g. placing a div within a span). Likewise, it will inform us if we've placed an element on the page but haven't used the correct containing element (e.g using a br, but not placing it within a p). What I'm looking for is some kind of documentation or reference guide that I can use, so I don't have to do a Google search every time I want to know if I'm correctly nesting elements! I would have thought that this would be defined by the XHTML schema at http://www.w3.org/2002/08/xhtml/xhtml1-strict.xsd. While this schema does define all the elements, it doesn't define how they are allowed to be nested in one another. Where can I find the documentation that defines correct nesting of elements? It must exist somewhere... Im trying to create a table for ebay use, i created pic for top left, top right, bottom left and bottom right. 1 also created pic for top middle (the middle part should be changeable- it can get longer or shorter same with the middle bottom and left and right middle pics) but the problem is i dont know how to make the right and left middle to repeat itself, also i dont know the correct HTML code to set the right middle picture in its rightful place. Im new in creating HTML, my goal is to have a table border that has a fixed size on all corners except for inbetweens - i want them stretching. i would appreciate some tips. Thanks HTML Code: <TABLE style="BORDER-RIGHT: #fff 3px solid; BORDER-TOP: #fff 3px solid; BORDER-LEFT: #fff 3px solid; BORDER-BOTTOM: #fff 3px solid" cellSpacing=0 cellPadding=0 width="95%" align=center> <TBODY> <TR> <TD vAlign=top align=left><img src="http://img222.imageshack.us/img222/8549/topleftea0.gif"></TD> <TD vAlign=top width="100%" background="http://img242.imageshack.us/img242/6443/topmiddleeq0.gif"></TD> <TD vAlign=top align=right><img src="http://img222.imageshack.us/img222/5030/toprightqx9.gif"></TD> <tr><td style="background:transparent url(http://img242.imageshack.us/img242/3990/leftframeru4.gif) left top;" valign="bottom"><img src="http://img242.imageshack.us/img242/3990/leftframeru4.gif"></td></TR> <tr><td style="background:transparent url(http://img364.imageshack.us/img364/4470/rightsidetq1.gif) right top;" valign="bottom"><img src="http://img364.imageshack.us/img364/4470/rightsidetq1.gif"></TR></TD> <TR> <TD vAlign=bottom align=left><img src="http://img242.imageshack.us/img242/4265/lowerleftqo9.gif"></TD> <TD vAlign=bottom width="100%" background="http://img242.imageshack.us/img242/1425/lowermiddlepn7.gif"></TD> <TD vAlign=bottom align=right><img src="http://img242.imageshack.us/img242/4020/lowerrightwo9.gif"></TD> Hey guys, Okay so here is what I am trying to do. I am populating a table with some info from a database. The data should look something like this. Recipe Name - Prep Time - Total Time- Rating ============================ test data here 12 mins 15 mins 4.5 test data here 12 mins 15 mins 4.5 test data here 12 mins 15 mins 4.5 test data here 12 mins 15 mins 4.5 The names of the recipe is what I want to create as links so that when the user clicks on a certain RECIPE NAME another page will open showing only the data that goes with that recipe he/she clicked on. So far I have not gotten my code to work correctly, i dunno if i am missing something or doing it all wrong? I am using a while loop to generate all the recipes form the database. Again, i want the names of the recipes to be the links. Please help me!!!! Thanks for your time and help Here is my code: <? while( $row = mysql_fetch_array( $result ) ) { ?> <tr> <a href="ShowRecipe.php?id=<?=$row['id']?>"></a> <td><?=$row['name']?></td> <td><?=$row['preptime']?> mins</td> <td><?=$row['totaltime']?> mins</td> <td><?=$row['rating']?></td> </tr> <? } ?> Hi, Im very new to php and mysql coding. Im trying to make support system for a basketball fantasy website where it predicts the player's next games fantasy pts. The tables consists of a number of columns; Game, OFF, DEF, REB, AST, STL, BLK, TO, PF and PTS. There is a number of rows that contains the values of these columns. I want to write some code that takes these values and multiple them with a value and add them to next column. So it like formula for example; Game|OFF|DEF|REB|AST|STL|BLK|TO|PF|PTS 1 | 1 | 0 | 2 | 1 | 3 | 1 | 0 | 2 | 6 2 | 2 | 0 | 2 | 1 | 3 | 1 | 0 | 2 | 6 The Formula would be (OFF *0.5) + (DEF*0.5) etc and place the result in column called FantasyPTS. So the resulting table would be like this; Game|OFF|DEF|REB|AST|STL|BLK|TO|PF|PTS |FantasyPTS 1 | 1 | 0 | 2 | 1 | 3 | 1 | 0 | 2 | 6 | ? 2 | 2 | 0 | 2 | 1 | 3 | 1 | 0 | 2 | 6 | ? Thank you in advance Hi there, After HOURS of battling with what I thought should be so simple I have given up and registered for help! The very basic form of my problem is I want a table with 3 cells, The first two cells (one black, one blue) I want to be left aligned and simply as wide as the cell contents. I then want the 3rd cell to be right aligned, and fill up the rest of the row before reaching the text. So the 3rd cell spans from the 2nd cell all the way to the right of the table. I have uploaded 2 images. One is the rough design that I'm trying to achieve, the other shows my results. what I want: http://imageshack.us/photo/my-images/705/hopez.png/ (the 'music videos' would be in a separate cell as the background will be blue as you can see in my tests below) actual: http://imageshack.us/photo/my-images/830/problemue.png/ It either ends up as above or with hours of fiddling I did somehow have it over at the right, but only behind the text was black, there was just open space between the blue cell and the right aligned cell. So frustrated, better go to bed, haha. Hello everyone. Im new to forums and am looking for some help my my html. I am having problems with the alignment of my tables. They used to align perfectly but are now being stretched the length of the page. It has to do with my TD somewhere but I can't find it. If you check this code you'll see what I mean. Im not sure what I did but it never had this problem before. Let me know what you guys think. Thanks Hi all, I love the design of this forum. I have a very annoying HTML problem and really need help. Would REALLY appreciate it. On some of the pages there's too much space between the table cells. I've tried EVERYTHING and couldn't find the source of the problem. Take it as a challenge and please help... Try this: http://www.canaseed.com/Search.aspx?search=csdc I've attached a gif file that describes the problem. Thank you so much for your help... Hi, I'm having a basic problem with a HTML table. It displays exactly how I want on Firefox 3.5.15 but on Internet Explorer 8 is does not. Can anyone point out what I need to do to get this table displaying in IE as it does in Firefox? Below is my HTML table and I suspect IE 8 is ignoring 'rules = rows'; <?php echo '<TABLE bordercolor=#000000 cellspacing=0 cellpadding=10 border=0 rules=rows frame=box width="90%">'."\n"; echo '<tr>'; echo '<td><B><font size=1>Test Name</font></B></td><td><B><font size=1>Date</font></B></td><td>'; echo '</tr>'; echo '<tr>'; echo '<td><font size=1>Test Number 1</font></td><td><font size=1>01/01/2010</font></td>'; echo '</tr>'; echo '<tr>'; echo '<td><font size=1>Test Number 2</font></td><td><font size=1>02/01/2010</font></td>'; echo '</tr>'; echo '<tr>'; echo '<td><font size=1>Test Number 3</font></td><td><font size=1>03/01/2010</font></td>'; echo '</tr>'; echo '<tr>'; echo '<td><font size=1>Test Number 4</font></td><td><font size=1>04/01/2010</font></td>'; echo '</tr>'; echo '<tr>'; echo '<td><font size=1>Test Number 5</font></td><td><font size=1>05/01/2010</font></td>'; echo '</tr>'; echo '<tr>'; echo '</TABLE>'."\n"."\n"; ?> Thanks! Hello Everyone! (hoping for quick reply.. lol) I am not sure if this should go here, or in the design section. I chose here, because it is a problem in the code itself. I have introduced myself in the introductory section, if you want to know a little bit more about what I am doing this for. I made a template design in The Gimp photo editor. I sliced it up, and opened up the HTML file in the editor Kompozer. It opened up just like it should, but I wanted a liquid type layout, so I turned the cell's widths into the corresponding percentages, though Kompozer rounded them off. (Shown below) However, when I previewed the file this time, it appeared as if it skipped every other cell, leaving a blank white space in its spot. Not even in the right percentages. I think I know what I've done wrong, looking back now that I am writing this thread. Can someone please point me in the right direction? EDIT: Code posted as comment, due to lack of character room. i was wondering if it is possible to nest ssi within each other... so like for this scipt i got from dynamicdrive.com for a drop down menu... is it possible to use ssi in side of ssi and it still work? Hey Guys, I want to have a square coloured grey and within that square I want another sqaure coloured gray. I want the layout to be fluid so if I expand or contract the browser the inner square will still maintain the same distance from the outer square. See the image below: I have tried and tried but I just cannot get it to work. I want to avoid using tables and stick to divs tags. Does anyone know how I can do this ? <html> <body> <script language="javascript"> function toggleDiv(divid){ if(document.getElementById(divid).style.display == 'none'){ document.getElementById(divid).style.display = 'block'; }else{ document.getElementById(divid).style.display = 'none'; } } </script> <table width="100%" align="left" cellspacing="1" cellpadding="0" class=table_bdr> <tr > <Td height="33" width="13%" align="left">CC</Td> <Td height="33" align="left" width="21%">Company name </Td> <Td height="33" align="right" width="14%">Clients</Td> <Td height="33" align="right" width="17%">Col1</Td> <Td height="33" align="right" width="17%">Col2</Td> <Td height="33" align="right" width="18%">Col3</Td> </tr> <tr > <Td height="20" width="13%" align="left">AB</Td> <Td height="20" align="left" width="21%">Company1 </Td> <Td height="20" align="right" width="14%" id="ss_report_link"><a href="javascript:;" onClick="toggleDiv('mydiv1');">12</a></Td> <Td height="20" align="right" width="17%">37</Td> <Td height="20" align="right" width="17%">14</Td> <Td height="20" align="right" width="18%">46</Td> </tr> <tr> <td colspan="6"> <div id="mydiv1" style="display:block; margin:0 0 0 0; padding:0 0 0 0; background:#C0E8FF"> <table width="100%" border="0" cellspacing="0" cellpadding="0"> <tr> <Td height="21" align="left" colspan="3" style="padding-left:130px" id=""><a href="#">Client1</a></Td> <Td height="21" align="right" width="17%">5</Td> <Td height="21" align="right" width="17%">1</Td> <Td height="21" align="right" width="18%">9</Td> </tr> <tr> <Td height="20" align="left" colspan="3" style="padding-left:130px" id=""><a href="#">Client2</a></Td> <Td height="20" align="right" width="17%">37</Td> <Td height="20" align="right" width="17%">12</Td> <Td height="20" align="right" width="18%">52</Td> </tr> <tr> <Td height="20" align="left" colspan="3" style="padding-left:130px" id=""><a href="#">Client3</a></Td> <Td height="20" align="right" width="17%">22</Td> <Td height="20" align="right" width="17%">17</Td> <Td height="20" align="right" width="18%">34</Td> </tr> <tr> <Td height="20" align="left" colspan="3" style="padding-left:130px" id=""><a href="#">Client4</a></Td> <Td height="20" align="right" width="17%">2</Td> <Td height="20" align="right" width="17%">1</Td> <Td height="20" align="right" width="18%">8</Td> </tr> </table> </div> </td> </tr> </table> </body> </html> This is my page (I have 14 columns actually. So every col gets less width than this). In Child table if I enter some lengthy value for Client name For ex: 'Client11111111111111111111111111111111111111111111' Every Column is moving right side. I dont want that. How to do that. I know this can be messy from time to time, but I believe this is the best way to lay out my page. This is for a report I'm producing. I have two columns on the left side of the information and the last two columns on the left that need to be visible at all times. There are a total of about 20 different columns. I have tried a few things but come to use three seperate tables, one on the left for the data that needs to be fixed there, one in the middle for data that can scroll and the last on the right for the other fixed data. I'm having trouble getting the table in the middle to scroll. Is this possible, and what code would help. The code involved is very lengthy currently, because I have the data in it. In the future the data will be generated by a seperate SAS program. Should I make this middle table an iFrame, or is it possible for it to scroll horizontally without using frames at all. Thanks for your help. Hello, I am newbie, just has started my adventure with html. I tried to make an easy static site, without any additional thingd, but it occured a problem. 1. I mean, as I put table in table because I did know how to to id in different way, to make buttons on the left stay up while text on the right is moving- if I do normal table with 2columns and on the left lets say 5rows for buttons, on the right I unite all rows to make one big sort of box for contents, as I go down and try to write something morre, the rows from the letf were enlarging too If the size of explorer or firefox is nor full screen, the text in contents is going away (like now in lycos server, where screen is not full, but "cut" by advertise) 2. I have highlighted buttons, but not always works, why? (i mean it works, but darker buttons are charging so slow- maybe it is so because i saved them in pgn instead in gif, and each one is about 50kb?) -probably it is not this- because I have just changed into gif, and it is still the same 3. Another problem, as I post the site, I have notice, that in firefox I can not navigate with buttons, while in explorer yes, is it a fault of my coding, or of server where I put website? Here I post my website: http://members.lycos.co.uk/aniaacolgate/ Could someone take a look on the code, and will be so kind to correct me? It is a basic easy site of very begginger I just wanted to make a shape like this: - top: a banner - buttons in horizontal and vertical way - under buttons: contents (sincerly would like to put frames, but do not know how to put them there, is on the left there r buttons Thank you so much in advance for reply Sorry for mistakes in language Can I put an HTML page within a html page in a table? I have this template that I need to email to people, it will not be on my website. Wow ever I need to change the information in one table every few days. The information is live I think it's called. It's like if I place google adsense in that table and decide to change it to ad-clicks later, I can't send everyone a new template, I need to be able to change just the information within that table. I'm going to go read up on frames, haven't used them in years. Any ideas! ~eDee My html problem keeps failling, with all my image codes.. shown for 10 errors which are all for the images what's wrong? Here is the code: <!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" /> <!-- New Perspectives on HTML and XHTML 5th Edition Tutorial 2 Case 2 Fiddler Home Page Author: Date: 2-16-2011 Filename: home.htm Supporting files: fiddler.jpg --> <title>, ITSE 1411 Lab Project 2, Tutorial 2 Case 2, Due 02/23/2011</title> </head> <body> <div> <img src="fiddler.jpg" alt="Fiddler on the Roof" /> <hr /> <a href="home2.htm"><img src="home.jpg" alt="home" /></a> <a href="slide1txt.htm"<img src="start.jpg" alt="start" /></a> <a href="slide1txt.htm"<img src="back.jpg" alt="back" /></a> <a href="slide2txt.htm"<img src="forward.jpg" alt="forward" /></a> <a href="slide6txt.htm"<img src="end.jpg" alt="end" /></a> <br /> <a href="slide1txt.htm"<img src="thumb1.jpg" alt="slide1" style="border-width: 5" /></a> <a href="slide2txt.htm"<img src="thumb2.jpg" alt="slide2" style="border-width: 0" /></a> <a href="slide3txt.htm"<img src="thumb3.jpg" alt="slide3" style="border-width: 0" /></a> <a href="slide4txt.htm"<img src="thumb4.jpg" alt="slide4" style="border-width: 0" /></a> <a href="slide5txt.htm"<img src="thumb5.jpg" alt="slide5" style="border-width: 0" /></a> <a href="slide6txt.htm"<img src="thumb6.jpg" alt="slide6" style="border-width: 0" /></a> </div> <hr /> <div> <img src="slide1.jpg" alt="slide1" /> </div> <blockquote> <p><i>Do You Love Me?</i> sung by Deb Ingalls and Thomas Gates</p> </blockquote> </body> </html> Would someone please help me with some HTML code? I am having problems creating tables. I need to create a 50% wide, one-row, two-column borderless table. PLEASE HELP! Thanks, Karen |