HTML - Ie Vs Firefox Nested Tables Problem
Hi
I need help in tables with 100%. Actually i am keeping a table with 100% fihed width in a <td>, but when i am minimising the IE or Firefox browser the columns are reducing , how to solve the problem Similar TutorialsHi, I am using CSS with nested tables. There are two <td> fields in the innermost table, and are having links inside them. When I open the page in IE, and move the mouse over to the first cell, the whole cell becomes active. But the second cell becomes active only if I take the mouse on the text. Why this inconsistency? Can anyone help? Thanks. Please refer attached html and css files Hello guys, I want to create a page with nested html tables. I have attached an image of exactly what I want. Can you please help me with that? hi everybody, i have a problem displaying an html page that contains nested tables, all in a div. now the testing page that i present is a simple html, which works just fine in FF, chrome, safari and opera. sadly, it doesnt in IE7 (didnt test other IE versions). the goal is to make the scroll of the div reflect the width of the tables. i dont know what is causing this, maybe there's something missing in my code, or just an IE bug, perhaps... Anyway, i appreciate you reading this and thanks for your help, if any. Hello, Can anybody help me out? I have a nested table as such: =========================================== <table cellspacing="0" cellpadding="3" border="1"> <tr> <td>Joe <table> <tr> <td>A </td> </tr> </table> </td> </tr> </table> =========================================== How can I get "Joe" and "A" on the same line without changing the table structure? (Can't change structure cuz this is how my server side code spits it out. But I can add styles and attributes.) I've tried all manner of floating, margins, padding, aligning, hspacing, vspacing, and nothing seems to work. Thanks for any help. I have some nested tables (collapse/expand kinda table). How can I align the columns of each nested table, if all are expanded I want to see all the columns underneath symetrical. I have attached the screenshot of what I am getting with the following code: HTML Code: <head runat="server"> <title>Untitled Page</title> <style type="text/css"> .collapsed { display: none; } table#container { background-color:#FFFFFF; border: solid #000 3px; width: 400px; } table#container td { border: solid #000 1px; } table#sub { background-color:#FFFFFF; border: solid #000 0px; width: 400px; } table#sub td { border: solid #000 1px; } .toprow { font-style: italic; text-align: center; background-color: #FFFFCC; } .leftcol { font-weight: bold; text-align: left; width: 1%; background-color: #CCCCCC; } </style> <script language="javascript" type="text/javascript"> //***collapsible rows function outliner(evt) { evt = (evt) ? evt : (window.event) ? window.event : ""; var oMe; if (evt.srcElement) { oMe = evt.srcElement; } else if (evt.target) { oMe = evt.target; } if (evt.srcElement) { //for IE var child = document.all[oMe.getAttribute("child",false)]; } else { //for Firefox var child = document.all[oMe.getAttribute("child",false)]; } //get child element //if child element exists, expand or collapse it. if (null != child) child.className = child.className == "collapsed" ? "expanded" : "collapsed"; } function changepic(evt) { evt = (evt) ? evt : (window.event) ? window.event : ""; var uMe; if (evt.srcElement) { uMe = evt.srcElement; } else if (evt.target) { uMe = evt.target; } var check = uMe.src.toLowerCase(); if (check.lastIndexOf("expand.gif") != -1) { uMe.src = "images/collapse.gif"; } else { uMe.src = "images/expand.gif"; } } </script> </head> <body onclick="outliner(event)"> <table id="container" border="1"> <thead> <tr class="toprow"> <td /> <td>Parameter</td> <td>Value</td> <td>DataType</td> </tr> </thead> <tr> <td class="leftcol"> </td> <td>name</td> <td>Mark</td> <td>String</td> </tr> <tr> <td class="leftcol"> <a><img border="0" alt="expand/collapse" class="expandable" height="11" onclick="changepic(event)" src="images/expand.gif" width="9" child="s2" p21="p21" p22="p22" p22="p23"></a> </td> <td>composite</td> <td>100,200,red</td> <td>CompositeType</td> </tr> <tr> <td colspan="4" bgcolor="cyan" class="collapsed" id="s2"> <table id="sub"> <tr> <td> </td> <td>X</td> <td>100</td> <td>Int32</td> </tr> <tr> <td> </td> <td>Y</td> <td>200</td> <td>Int32</td> </tr> <tr> <td class="leftcol"> <a><img border="0" alt="expand/collapse" class="expandable" height="11" onclick="changepic(event)" src="images/expand.gif" width="9" child="s3"></a> </td> <td>color</td> <td>134,122,234</td> <td>Color</td> </tr> <tr> <td colspan="4" bgcolor="cyan" class="collapsed" id="s3"> <table id="sub"> <tr> <td> </td> <td>R</td> <td>134</td> <td>Int32</td> </tr> <tr> <td> </td> <td>G</td> <td>122</td> <td>Int32</td> </tr> <tr> <td> </td> <td>B</td> <td>234</td> <td>Int32</td> </tr> </table> </td> </tr> </table> </td> </tr> </table> </body> How can I make textbox in cell[2,2] get its right border displayed and aligned with upper cell??? <table style="padding-right: 20px" cellspacing="0" cellpadding="0" width="1000px"> <tr> <td width="25%"> <span id="Label9">label</span><br /> <input name="TextBox10" type="text" id="TextBox10" style="border-width:1px;border-style:solid;width:100%;" /> </td> <td width="25%"> <span id="Label10">label</span><br /> <input name="TextBox11" type="text" id="TextBox11" style="border-width:1px;border-style:solid;width:100%;" /> </td> <td width="25%"> <span id="Label11">label</span><br /> <input name="TextBox12" type="text" id="TextBox12" style="border-width:1px;border-style:solid;width:100%;" /> </td> <td width="25%"> <span id="Label12">label</span><br /> <input name="TextBox13" type="text" id="TextBox13" style="border-width:1px;border-style:solid;width:100%;" /> </td> </tr> <tr> <td> <table cellspacing="0" cellpadding="0" style="width: 100%"> <tr> <td style="padding-right: 15px" width="50%"> <span id="Label18" style="display:inline-block;width:100%;vertical-align: top; text-align: left">label</span><br /> <input name="TextBox19" type="text" id="TextBox19" style="border-width:1px;border-style:solid;width:100%;" /></td> <td align="right" width="50%" > <span id="Label19" style="display:inline-block;width:100%;vertical-align: top; text-align: left">label</span><br /> <input name="TextBox20" type="text" id="TextBox20" style="border-width:1px;border-style:solid;width:100%;" /></td> </tr> </table> </td> <td> <span id="Label20">label</span><br /> <input name="TextBox21" type="text" id="TextBox21" style="border-width:1px;border-style:solid;width:100%;" /> </td> <td colspan="2"> <span id="Label21">label</span><br /> <input name="TextBox22" type="text" id="TextBox22" style="border-width:1px;border-style:solid;width:100%;" /> </td> </tr> </table> Hi I have a main div called wrapper - it holds the main content of my site. It has a thin border around it. In Firefox, it just appears as a thick horizontal line, and it's contents appear underneath it. I have checked the nestings, and they all seem right - in other words, this DIV definitely contains content, and it shows in IE, just not Firefox. If I type text next to <div id="wrapper">, it appears in the wrapper div, and pushes the rest of the content down the page. I don't get it. The code says the content is in the div, but it's not. HELP!!! Cheers Shaun Hello all, I am working on a site and having 2 problems. 1. How do you center a whole table? I try table align="center" but it centers all the elements 2. I try to do table width=80% and in IE it works but it doesnt work in firefox Anyone have any ideas? This page looks fine in IE but tables are too wide in Firefox. Can anyone tell me what I need to change? http://tinyurl.com/2crnbe Thanks! There's something wrong with the tables on the site I'm currently working on.. There's no errors of any kind, but they're acting kind of odd.. I tried to make the code as clean as possible, but since this is a dynamic page, that isn't always easy. In Firefox i get a gap from time to time in the cell background of the page. But if i try to update it gets fixed. In Opera it stays like this all the time Here's a link to the page http://svolvar-jff.net/new/index.php?side=aktiviteter&id=12 I have run into a problem when using tables in Firefox. I code for IE 6.0 and I like my browser to determine when to put text on a new line once the table width has been reached. Rather than put breaks <br> in my text I just let the browser decide. When I open a page in Firefox it does not wrap the text within the table it just allows the text to flow to the right until the end of the text occurs. To fix this I now have to use <br> whenever I want a new line to begin but this creates other problems when others view my pages in IE 6 or IE 7 as the line breaks are now choppy sometimes consisting of one word on a line. My screen resolution is 1280x1024 but if someone does not have this resolution the page is a mess. I am using Dreamweaver as my editor and Firefox 2.0.0.15. Works just fine with IE 6 or IE 7. Can anyone help me with this? Here is an example of a page that I been forced to put <br> at the end of each line: http://www.outdoorphotographycanada.com/dwilson.html Thanks, Dave I got a prob: the site i'm designing looks great in IE, but in Firefox, all the tables collapse and it looks crap. i've taken care to sort the opacity of my transparent divs with the "-moz-opacity" tag, but is there a tag that does the same for tables? check it out he http://www.creativetruth.co.za/divercity/index.html I feel really stupid now, I can't figure out how to start a new thread. Please someone help me figure out what is wrong with my nested frames: <html> <head> <title></title> </head> <frameset rows="99%"> <frame src=""/> <frameset cols="20%,80%"> <frame src=""/> <frame src=""/> </frameset> </frameset> </html> They work individually but not collectively. Thanks in advance! I hand coded my website myself, but whilst working perfectly in IE, there are some problems when viewing it using Firefox. Specifically, the table rows have double-spacings (scroll down to the 'Education' section he www.lombrozo.co.uk/resume.html), and also table borders have a 3D look (a black border to emphasise the shadow), again, this shadow is not visible in IE... Any ideas anyone? Any help would be most appreciated! HI Every Body, Can you please help to resolve this issue. I am trying to create nested tables using the following code but no luck . In IE 7.0.6 the Nested tables are getting displayed as two seperate table. <HTML> <Head> <Title> MY First Application </Title> </Head> <Body> <Table border=1 Height=750 width=540 BORDERCOLOR=Red > <Tr> <Td> This is my first row/column </Td> </Tr> <Tr> <Table border=1 Height=130 Width=540 > <Tr> <Td> This is my firstcolumn in nested table</Td> <Td>This is my second column in nested table</Td> </Tr> </Table </Tr> </Table> </Body> </HTML> PLease let me know the solution Thanks in advance. Regards, Eswar http://www.yandina.com/JIndex.htm Open in Firefox, Chrome or Safari - - - that is what it is supposed to look like. Open in IE and the last table get overlaid on top of the previous table. What sort of things can cause that? Additional (unrelated I think) problem, IE is not accessing cookies but others are fine. What can cause that? I made a layout in dreamweaver but im getting problems, my navigation is stretching when i add too much content to the content table, it shows fine in chrome but in firefox and IE i get this Any ideas whats causing this? I have a table with 5 columns and it does not render correctly in IE on a 1024 x 768. The problem goes away by increasing two column widths from 5% to 8%. I have not tested the pages on platforms with a lower resolution. I prefer to use the version with the narrower columns. Please help me achieve the preferred layout, and explain what it is that I am doing incorrectly. Related data: Windows XP is used for all examples. With Firefox, Opera and Safari both widths are OK on 1024 x 768 and 1440 x 900 monitors. http://www.iaps.com/eval/courses18-5-54-5-18.html Column % widths are 18-5-54-5-18: 1024 x 768 IE6: Problem (both 5% columns do not appear) IE7: Problem (both 5% columns do not appear) 1440 x 900 IE6: No problem IE7: No problem http://www.iaps.com/eval/courses15-8-54-8-15.html Column % widths are 15-8-54-8-15: 1024 x 768 IE6: No problem IE7: No problem 1440 x 900 IE6: No problem While the page may not be very attractive, it has to render properly. Thanks in advance, Don I'm a 13 year old kid that's sort of experienced in HTML. I'm pretty sure tables are HTML and not css. Because I was wondering, I made a website and all, mostly out of tables and pictures. What is the code to end a table at the very bottom? Because if I just use img src, theres a small space between it. I'm trying to fix that, and I really need the code. I can't explain it any better. If you need my website, it's http://www.freewebs.com/maralake/ Look at the bottom, the layout just ends with nothing, blank. I have the bottom picture, I just don't know how to add it properly. I'd really appreciate if you help me. |