HTML - Firefox/i.e. Table Problem!
Similar TutorialsHello, 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 Hi Can anyone solve this problem. Here is my 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=iso-8859-1" /> <title>Hide/Show Test!</title> <style> .myclass1 { background-color:#CCCCCC; display:block; } .myclass2 { display:none; } </style> </head> <body> <script> function hideNshow(){ var e1=document.getElementById('A1C1_1'); if(e1.className=="myclass1") { e1.className="myclass2"; } else { e1.className="myclass1"; } e1=document.getElementById('A1C1_2'); if(e1.className=="myclass1") { e1.className="myclass2"; } else { e1.className="myclass1"; } } </script> <!-- <input type="button" name="myBtn" value="Click Me!" onclick=" hideNshow();"/>--> <table width="100%" border="1" cellspacing="0" cellpadding="0"> <tr> <td><a href="#" onclick=" hideNshow();">Row1/Cell1</a></td> <td >Row1/Cell2</td> <td>Row1/Cell3</td> </tr> <tr id="A1C1_1" class="myclass2"> <td>Row2/Cell1</td> <td>Row2/Cell2</td> <td>Row2/Cell3</td> </tr> <tr id="A1C1_2" class="myclass2"> <td>Row2/Cell1</td> <td>Row2/Cell2</td> <td>Row2/Cell3</td> </tr> <tr> <td>Row3/Cell1</td> <td>Row3/Cell2</td> <td>Row3/Cell3</td> </tr> <tr> <td>Row4/Cell1</td> <td>Row4/Cell2</td> <td>Row4/Cell3</td> </tr> <tr> <td>Row5/Cell1</td> <td>Row5/Cell2</td> <td>Row5/Cell3</td> </tr> </table> </body> </html> It is working fine in IE. When I click the link It displays the hidden rows and hides when I click the link agian. But in Firefox it is giving error. It is adding empty rows. How to prevent that. Thanks in advance. Not a major programmer but I needed to make a website. I am having a problem with my website where I have 5 pages, same structure, built with tables, all tables centered. In IE the tables align center on each page. But in Firefox --- 3 of the pages are different, lining up about 10 pixels left of center. Does anyone know how I can fix this problem? I have browsed around other sites as well and many of them have this problem. Any advice would be greatly appreciated. I know tables are horrible but thats all I know/can learn. Hi, I created a table with rounded corners and I'm having a white-space problem in the inner bottom and top part of the table while using the MOZILLA FIREFOX browser. The URL below will show you what I'm talking about. I've spent many hours trying to get rid of those white spaces but cant figure out. http://www.imageenvision.com/test.html Code: <!DOCTYPE HTML PUBLIC '-//W3C//DTD HTML 4.01//EN' 'http://www.w3.org/TR/html4/strict.dtd'> <html> <head> <title>TEST</title> <link rel="stylesheet" href="/css_style_sheet.css" type="text/css"> </head> <body> <table align='center' width='500' height='0' border='0' cellspacing='0' cellpadding='0'> <tr> <td width='0' height='0'><img src='/pics/top_left_rounded_corner.gif' height='9' width='9' border='0'></td> <td width='100%' height='0'><img src='/pics/top_middle.gif' height='9' width='100%' border='0'></td> <td width='0' height='0'><img src='/pics/top_right_rounded_corner.gif' height='9' width='9' border='0'></td> </tr> <tr> <td colspan='3' height='100' align='center' bgcolor='#F8F8F8'><!--MAIN TABLE STUFF--></td> </tr> <tr> <td width='0' height='0'><img src='/pics/bottom_left_rounded_corner.gif' height='9' width='9' border='0'></td> <td width='100%' height='0'><img src='/pics/bottom_middle.gif' height='9' width='100%' border='0'></td> <td width='0' height='0'><img src='/pics/bottom_right_rounded_corner.gif' height='9' width='9' border='0'></td> </tr> </table> </body> </html> Thanks in advance for your help. Kenny Adams Image Envision The table itself is working fine, but the size of each cell is not correct in Firefox. Here is a screenshot of what is happening: http://img35.imageshack.us/img35/1938/tabletroubles.gif Here is the head of my page, the css for the table is he HTML Code: <style type="text/css"> #cat table {border:0px solid #333333; cell-padding:0; cell-spacing:0; align=center} #cat tr {align=center} #cat td {font-size: 13px; font-family=tahoma; font-weight: bold; padding: 0px; border:0px solid #333333; align=center;} #cat td a {text-decoration: none; color:#757575; background-color: white; display:block; height=23; background-image: url(linkbg1.gif); align=center;} #cat td a:hover {background-color: #333333; font-weight: bold; text-decoration: none;color: #ffffff; background-image: url(linkbg2.gif); align=center;} </style> and here is the table code, located in the body of the page: HTML Code: <div style="Height:53px; overflow:auto; width:900px; position:absolute; top:0; left:0"> <TABLE bgcolor=#333333 cellspacing=0; cellpadding=0;><tr><td> <div id="cat"> <table width=900; cellpadding:0px; cellspacing:0px> <tr align=center> <td width=20%> <font face=tahoma><a href="home.html">Home</a></font> </td> <td width=20%><center><font face=tahoma><a href="openings.html" target="_top">Openings</a></font></center></td> <td width=20%><center><font face=tahoma><a href="dance.html" target="_top">Dance</a></font></center></td> <td width=20%><center><font face=tahoma><a href="projects.html" target="_top">Projects</a></font></center></td> <td width=20%><center><font face=tahoma><a href="vocaloid.html" target="_top">Vocaloid</a></font></center></td> </tr> <tr> <td width=20%><center><font face=tahoma><a href="fanflashes.html" target="_top">Fanflashes</a></font></center></td> <td width=20%><center><font face=tahoma><a href="caramelldansen.html" target="_top">Caramelldansen</a></font></center></td> <td width=20%><center><font face=tahoma><a href="cosplay.html" target="_top">Cosplay</a></font></center></td> <td width=20%><center><font face=tahoma><a href="endings.html" target="_top">Endings</a></center></td> <td width=20%><center><font face=tahoma><a href="anime.html" target="_top">Anime Episodes</a></font></font></center></td> </tr> </table> </div> </td></tr></table> </div> A table is nested within another table. The table on the outside has no content, it is there to make a gray border around everything else. If you look at the table in firefox & internet explorer, you'll see that in IE- the table is much thicker than in firefox. How can i make it so that the table in Firefox will have the same thickness as the one in IE? I could really use some help. Thanks! Hi guys Attached is an image of the problem I'm having where in Firefox my table borders are not displaying correctly. I've coded using standard html as follows: Code: <table width=100% cellspacing="0" cellpadding="5" bgcolor="ffffff" border="1px" bordercolor="C0CFE2"> Any Ideas? The one on the left is the Firefox version. Hi! this is really weird. I build a simple page with a table with a background picture. In Explorer it's all good but in Chrome & Firefox, you cant see the background picture of the table. help please? thanks Jeni I have searched this and other forums and tried everything I could possibly think of to fix this. The space doesn't appear in any browser except IE, and unfortunately I need to make the site work fine in IE as well: http://www.mountwernerrealty.com/index3.html I have the exact same table at the very bottom of this page that is centered in both IE and Firefox... http://www.massagelaunch.com/ but on this page I have the exact same table that IS NOT CENTERED in Firefox...any idea why? http://www.massagelaunch.com/affiliates.html Thanks in advance! Anyone else come across problems with table rendering in firefox? It seems to happen with larger tables, say a table with 30+ cells for a calendar. Sometimes firefox will render extra cells and throw everything off. The code is fine, this will happen randomly in different locations. Sometimes a refresh will fix the issue, sometimes the refresh will just move the issue to another location. I've noticed that display:inline-table; fixes the problem for firefox, but in other browsers like opera display:inline-table; will get rid of margins (which I need). Anyone know anything about this? Hi, I have searched the forums for an answer to this question, but I couldn't find anything that solves my problem. I have designed a site in Dreamweaver. http://www.dirt-e-riders.com In IE 6 and IE 7 it shows correctly, but in firefox the backgound image for my table doesn't show. In effect I have two main tables, each sized at 100% width. Table 1 is at the top of the page and contains a bg. in jpg format Table 2 is just below that and also contains a bg. in gif format I didnt make the bg for table1 a gif cause the quality is too poor. The bg for table1 does not show, but the bg for table 2 does. I have already tried to read the bg from my CSS with no repeat but it does the same. Could someone please help me. I'm new to web design. Your help will be greatly appresiated. Thanks Hi Everyone, This sort of issue must be raised pretty often, but: I just uploaded a website for a friend of mine. I'm a firefox 1.5 user, but believed i had tested in IE also. I was dismayed this morning though to discover on of my pages looks completely ridiculous in IE 6. If you have facility, check the page out with both IE and firefox at http://www.bayonetrecords.com/record...ayrequiem.html I'm using a repeating region to add tracks to an album template. Apart form misusing the template, i have no idea what could cause such a divergance in IE. I'm by no means an advanced HTML user, but at very least thought i knew how to insert a table! Any help on this issue would be greatly appreciated, as would any pointers on how to keep IE in check thanks in anticipation, asher. The bgcolor of a table works in Iexplorer but not in Firefox. Also the left/right/topmargin doesnt work at all in Firefox. Any idea how this is? Thanks for your help --khan Hi, My website layout is based on html tables about 750 pixels wide and was set up in Dreamweaver 4. It works fine in Explorer, but in Firefox each page explodes to the full screen size during loading before snapping back to the correct size when loading completes. This is ok, but I would prefer it to display correctly whilst loading (as it does in Explorer) as it looks rather messy. Is there a way to prevent this? Thanks, Richard. Greetings, everyone! I'm glad to have found this site! I've been building a website - I'm pretty limited to just HTML knowledge and a little CSS - and everything is going along okay, except I'm stumped on this one issue. I got tired of everything looking so 'boxy', since I use a lot of Tables to create my site, so I learned how to add rounded corners to my tables, which helps a lot. However, what looks good in my Firefox browser (the one I normally use) does not look right in Internet Explorer. Basically, on the right side of the main table, where I placed a graphic of a rounded edge, I'm still getting a weird white border line, even though I've set all my borders to zero. I was wondering if someone could take a look at my page and tell me where I'm messing up. Here's a direct link to the page in question.... http://www.kitwoo.com/kitwoo_seo.html If you look at it in Firefox, it looks fine, but in IE (I think I'm using the latest version of both browsers) you can see that little white line on the right side of the table. Thanks in advance for any suggestions! Can anyone tell me why? Not sure what is going on here... Here is a link to the development site where you can see the problem I am having (I did not design it, but I am in charge of changing to html). http://www.vismarkgroup.com/dev/Kyrie/about.html Thanks!! http://matc.studentsites.net/restorf...nal/index.html I can't get my bgcolor to display in the main content table. I tried adding it to the tr, td, and the style sheet. Nothing seemed to work. Works fine in IE and Opera. Any ideas? Edit: Also my text in the footer isn't formating. http://pizzarific.net84.net/ - please visit my website that i am developing for our php website. i have not yet embedded any php scripts there. please try to view the "pizza and food" both in firefox and IE7. how can resolve IE weird table width. Please help me. if you want i can give you my website files. thank you very much Fixed it on my own. Sorry about the post. Mods: Please delete this :] My tables background color (done with dreamweaver) isn't showing correctly in Firefox. but is in internet explorer. Code: <td colspan="2" rowspan="4" bgcolor="de8801">TEXT</td> is the code I'm using to define the background color? Can anyone help?! Anders |