|
HTML - Problems With Table Codes In Firefox Vs Ie
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! Similar TutorialsThe 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! 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 Hello to all those whom (m-one, pegasus and coothead, and others) helped rkgrkg with her webpages: I took a look at them and then went to the website she went to to get the script for her tabz thanks to m-one, I intergrated it using their format, plus added other scripts, "thanks coothead (for his x/y script)" to dassel it up using her color themes. Now for the bad news , I have a older computer (not being wealthy ), so I only have IE6 and Firefox 2.0. When I dasseled the webpages I used IE6 to display it as I created. It looks kwel and beautiful in IE6, but when I tried to display it in Firefox 2.0 it became all unbounded. I used the error counsel on Firefox 2.0 to see any errors that maybe causing problems, the only thing displayed there was my scroll-bar style entries sayed it "dropped" them lol. I tried messing with the css files, but when I did some parts came together in Firefox but then came undone in IE6, Fustrated, I put everything back as it was. and said, "The Heck with Firefox" even though I knew rkgrkg Uses it. I have uploaded these 2 beautiful pages and the content heref. Can someone who is more talented and smarter then I, please, take a look at my finished/fustrated work so you can see it in Firefox as well as IE, and please help so I don't feel useless (*feel like I waisted my time trying to help*) and stupid. Thank You Very Much in Advance! Funny thing with our website, which is victorylifecenter.org In firefox on the right hand side we have two images, one is upcoming events and the other is a email login. both show up in firefox In IE neither or there, they just do not show up? Any ideas? thanks Hi, I am a newbie, and I am desgining a website. I am using tables in Dreamweaver (I know this may not be the right choice, but its the only way I know), and inside the cells I'm placing .swf buttons. When I preview in Safari, Chrome, and Opera it looks like it should. However, when I preview in Firefox, the buttons are too spaced out vertically, as if the cells had increased their height (making the buttons very far apart from eachother). I understand Firefox is one of the best browsers, if not the best, so I assume it is me who is doing something wrong. I will email the code to anyone who needs it. Thank you in advance. It seems that when opening my page in firefox my navigation bar is all over the place and my transparencies don't seem to be working either. Any help? Thanks. Here's the link http://www.foswebsolutions.com ...and the css http://www.foswebsolutions.com/style.css I did some searching, but have not found the exact probelm here, so I am starting new: I created a site using CSS/HTML for my layout (using Dreamweaver). Whenever I view it using IE7, it looks great and everything works. When I open it in Firefox, once again it looks good, except for the bottom of the divisions right above my footer, there is a 20px offset and blank space on the 2 side divisions, but not the center one. Lastly, when you view this in IE6 or IE5.5, the middle division is pushed down past the 2 side divisions so you see blank space between those and scroll down to see the middle division. It is only in the building stages and some links are not completed yet, and the main site is: http://dana.sportslineceramics.com I piggy-backed it off my own website so I can view it live and work on it. I have tried everything I can think of to get it to display right, and it just does not. I want to use an <iframe> in the middle division so that all links open on that same page instead of having 17 different pages. Thanks in advance for any suggestions! Hi all, First post here hope someone can help. I'm creating a portfolio web page for my 3D work and using this to learn a bit of web design. My current problem comes from using absolute positioning to get text to float over a background image in a precise location. I have this as I want it in Fiirefox 2.0.0.6 but the text all appears a fair bit higher in IE (I have looked using IE 6 on its own and by changing the render mode to IE in Firefox). I realise I need to do a fair bit of validation and refinement to the site but at the moment I want to get this alignment issue sorted so the site is at least visible while I work on other elements. Page url: www.iamjames.co.uk The text in question is on the used on all pages! Thanks in advance James Hi! My site finally seems to work fine in IE, but now that I'm checking it with Firefox, it turns out to have many problems. I fixed most of them, but the one that's bugging me is that the main text is lower than it should be. Here are the html and css: HTML Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<SCRIPT TYPE="text/javascript">
function popup(mylink, annonces)
{
if (! window.focus)return true;
var href;
if (typeof(mylink) == 'string')
href=mylink;
else
href=mylink.href;
window.open(href, annonces, 'width=600,height=600,scrollbars=yes');
return false;
}
//
</SCRIPT>
<TITLE>Duo: balalaika et piano -- Dmitri Nassyrov et Victoria Khramova</TITLE>
<META HTTP-EQUIV="Content-Type" CONTENT="text/html; Charset=Windows-1251">
<META NAME="GENERATOR" CONTENT="Microsoft FrontPage 5.0">
<META NAME="Author" CONTENT="Dmitri Nassyrov">
<META NAME="KeyWords" CONTENT="balalaika, Victoria, Khramova, Dmitri, Nassyrov,
concerts, piano, duo, stringsandkeys, douce, soiree, histoire, du, balalaika">
<META NAME="Description" CONTENT="Le duo du balalaïka et du piano: Dmitri
Nassyrov et Victoria Khramova, ont un repertoire tres varié: folklorique,
classique, jazz, et autres... ">
<TITLE>Duo:balalaïka et piano - Dmitri Nassyrov et Victoria Khramova</TITLE>
<link rel="stylesheet" type="text/css" href="style.css" />
</HEAD>
<div id="container">
<BODY BGCOLOR=beige TEXT="#000000" LINK="#0000FF" VLINK="#7F007F" ALINK="#FF0000"
BACKGROUND="../site/img/bcknd.jpg">
<script language="javascript">
var u=13200;
var vsbl=0;
var l='';
</script>
<script type="text/javascript" language=Javascript
src="http://h1.hitslog.com/counter.js"></script>
<script language="javascript">
document.write('<a href=http://hitslog.com/><img border=0 width=1 height=1
src=http://h1.hitslog.com/hl.php?'+l+'></a>');
</script>
<noscript>
<a href="http://hitslog.com/"><img border=0 width=1 height=1
src="http://h1.hitslog.com/hl.php?u=13200" alt="MySpace tracker"></a></noscript>
<TABLE id="main">
<tR width=720 height=160>
<td valign=top width=615 height=160><IMG width=615 height=160 alt="Duo:
balalaïka et piano - Dmitri Nassyrov et Victoria Khramova" SRC="HEADER.gif">
</td>
<td>
<table valign=center width=105 height=75 cellpadding=0>
<tr class="lang">
<td class="lang">
<img alt="En Français" border=0
src="../site/img/francaisclik.gif" >
</td>
</tr>
<tr class="lang">
<td class="lang">
<a href="../eng/index.html"><img alt="In English"
onmouseover="this.src='../site/img/englishon.gif'"
onmouseout="this.src='../site/img/english.gif'"
onclick="this.src='../site/img/englishclik.gif'" border=0
src="../site/img/english.gif"></a>
</td>
</tr>
<tr class="lang">
<td class="lang">
<a href="../rus/index.html"><img alt="По-Русски"
onmouseover="this.src='../site/img/russianon.gif'"
onmouseout="this.src='../site/img/russian.gif'"
onclick="this.src='../site/img/russianclik.gif'" border=0
src="../site/img/russian.gif"></a>
</td>
</tr>
<tr width=105 height=85>
<td width=105 height=85 align=center>
<img alt="Duo: balalaïka et piano - Dmitri Nassyrov et
Victoria Khramova" src="sideheader.gif">
</td>
</tr>
</table>
</td>
</tR>
<TR>
<td colspan=2>
<table width=720>
<tr>
<td valign=top>
<TABLE valign=top>
<TR>
<TD class="menu"><A HREF="INDEX.HTML"><img src="bienvenueclik.gif"
alt="Bienvenue" border="0"></a></TD>
</TR>
<TR>
<TD class="menu"><A HREF="DUO.HTML"><img src="../img/leduo.gif" alt="Notre
duo" onmouseover="this.src='../img/leduoon.gif'"
onmouseout="this.src='../img/leduo.gif'" onclick="this.src='../img/leduoclik.gif'"
border="0"></A></TD>
</TR>
<TR>
<TD class="menu"><A HREF="concerts.HTML"><img src="../img/concerts.gif"
alt="Nos concerts" onmouseover="this.src='../img/concertson.gif'"
onmouseout="this.src='../img/concerts.gif'"
onclick="this.src='../img/concertsclik.gif'" border="0"></A></TD>
</TR>
<TR>
<TD class="menu"><A HREF="audio.HTML"><img src="../img/audio.gif" alt="Notre
musique" onmouseover="this.src='../img/audioon.gif'"
onmouseout="this.src='../img/audio.gif'"
onclick="this.src='../img/audioclik.gif'"border="0"></A></TD>
</TR>
<TR>
<TD class="menu"><A HREF="historique.HTML"><img src="../img/historique.gif"
alt="L'Histoire du balalaïka" onmouseover="this.src='../img/historiqueon.gif'"
onmouseout="this.src='../img/historique.gif'"
onclick="this.src='../img/historiqueclik.gif'" border="0"></A></TD>
</TR>
<TR>
<TD class="menu"><A HREF="liens.HTML"><img src="../img/liens.gif" alt="Liens"
onmouseover="this.src='../img/lienson.gif'" onmouseout="this.src='../img/liens.gif'"
onclick="this.src='../img/liensclik.gif'" border="0"></A></TD>
</TR>
<TR>
<TD class="menu"><A HREF="contact.HTML"><img src="../img/contact.gif"
alt="Comment nous rejoindre" onmouseover="this.src='../img/contacton.gif'"
onmouseout="this.src='../img/contact.gif'" onclick="this.src='../img/contactclik.gif'"
border="0"></A></TD>
</TR>
</TABLE>
</tD>
<TD VALIGN=top>
<table height=100% width=500 class="text" cellpadding=20>
<tr>
<td>
<!--<marquee id="test" onMouseOver="document.all.test.stop()"
onMouseOut="document.all.test.start()" scrollamount="2" scrolldelay="20" width="100%"
height="51" behavior="scroll" direction="left"><font face="arial"
align=middle><i>
<A HREF="annonces3.html"
onClick="return popup(this, 'annonces',true)"><b>17 novembre - 20:00</b></A><br>
Festival "From Russia With Love"<br>
à la bibliothèque publique juive.
</i></font></marquee>-->
</td>
</tr>
<tr>
<td valign=top><font face="times new roman" size=3><h2>Un duo, c'est
indivisible...</h2>
<p align=justify>Dans un duo, le rôle de chaque musicien n'est pas seulement de
compléter son partenaire, mais aussi de souligner la sonorité de son
instrument.</p>
<p align=justify>Notre duo est assez particulier et assez unique à
Montréal. Les deux instruments composant notre duo sont: le piano et le
balalaïka - instrument folklorique russe. Les possibilitées de cette union
sont surprenantes, dans le répertoi folklore, classique, jazz...</p>
<hr width=95%></hr>
<p>Sur ce site, vous trouverez de l'information sur nos <A
HREF="concerts.HTML">concerts</A>, vous pourrez écouter nos <A
HREF="audio.HTML">enregistrements</A>, lire nos <A HREF="DUO.HTML">biographies</A>, et
plus encore.</p>
<p>Et, bien sûr, nous serons heureux de vous voir à nos concerts!</P>
<p><i>Dmitri Nassyrov et Victoria Khramova</i></p>
</TD>
</tr>
</table>
</td>
</tr>
</table>
</td>
</TR>
</TABLE>
<font face="arial" size=1
align=right> &nb
sp;
&nb
sp;
&nb
sp; Dmitri Nassyrov et Victoria Khramova © Tous droits
réservés.</font>
</BODY>
</div>
</HTML>
HTML Code: body {
text-align: center;
background-color: rgb(239,197,137);
background-attachment: scroll;
background-position: center;
background-image: url("bkg.jpg");
background-repeat: repeat-y;
}
#container {
margin: 0 auto;
text-align: left;
position:relative;
width:720px;
}
div.text
{
background-image: url("../site/img/textbcknd.jpg");
}
#main {
border:0px; /* border="0" */
border-collapse:collapse; /* cellspacing="0" */
}
#top {
border:0px; /* border="0" */
border-collapse:collapse; /* cellspacing="0" */
}
tr.lang {
horizontal-align:left;
width:100px;
height:25px;
}
td.lang {
horizontal-align:left;
width:100px;
height:25px;
}
td.menu {
width:220;
height:40;
}
table {
border-collapse:collapse;
}
table.text {
padding:20px;
background-image: url("../site/img/textbcknd.jpg");
}
Any help is appreciated. Thank you very much! Having problems with my logo on ie and firefox. It opens fine in safari. Site is www.justintimemelodies.com. I am new to html and am not sure what the problem is. I assume i need to add something for the coding to show in those two browsers. the following is the code:<div id="Logo"> <a href="index.html"><img src="./images/JustInTime2.jpg"alt="Home" border="0"></img></a></div> <a href="index.html"></a> So we have this old website that we're updating and in our updates we've found that the text will now run over the margins (into our pretty white space). We don't want it to pass the blue tab that says "Contact". Any ideas? http://www.carlsonbldgservices.com Also how can I remove the underline in "Click to Enter"? In a website i'm designing, there is a slideshow I created, and instead of using flash I used Windows Media Player. For some reason the html border attribute on both the <embed> and <object> tags, when viewed in Firefox, do not work. Page with border problems here is the code, if you want it: Code: <center>
<object id="MediaPlayer"
width="800"
height="650"
classid="CLSID:22D6f312-B0F6-11D0-94AB-0080C74C7E95"
standby="Loading Windows Media Player components..."
type="application/x-oleobject"
codebase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=6,4,7,1112"
title="Pete's Mountain Road Slideshow"
border="3">
<param name="filename" value="http://www.petesmountainroad.com/PetesMountain.wmv" />
<param name="Showcontrols" value="True" />
<param name="autoStart" value="False" />
<param name="wmode" value="transparent" />
<embed type="application/x-mplayer2" src=http://www.petesmountainroad.com/PetesMountain.wmv"
name="MediaPlayer"
autoStart="False"
wmode="transparent"
width="800"
height="650"
title="Pete's Mountain Road Slideshow" />
</object>
<br />
<p class="main">If you do not have Windows Media Player, you can view the video by following
<a class="Link" href="http://www.microsoft.com/windows/windowsmedia/player/11/default.aspx" target="_blank" title="Download Windows Media Player 11">this link</a>
to download the program to your computer, then try to play it again.</p>
</center>
</body>
</html>
Basically I'm in the process of creating a website and things aren't going down so well on the coding front. http://blazeshare.net/ (temp URL) As you can see part of the table becomes stretched or w/e. I am in a rush so I've just used Dreamweaver and can't think for the life of me why its doing this. I tried valign on like every row/column in the damn code in another version to no avail, might have something to do with the way I sliced it. Been a while since I've attempted something like this so I'm a bit stuck. table code : http://blazeshare.net/nbdistro.txt As I said, messy coding because rushed using dreamweaver to make things easy. But apparently not.. lol. Anyone know the reason for this? This page works correctly in Firefox and Chrome, but not IE. What can I do to fix it? Many thanks. http://pivotanimator.net/faq.html i've got a little problem with an html table (sorry if i bothered you by adding colors to the table rows) Quote: <table border="1" width="900px" align="center"> <tr> <td bgcolor="#e6e6e6"> </td> </tr> <tr> <td bgcolor="#d2d2d2" width="900px" height="15px"> </td> </tr> <tr> <td bgcolor="#ff0000" width="900px" height="130px"> </td> </tr> <tr> <td bgcolor="#0024bf" width="900px" height="25px"> </td> </tr> <tr> <td bgcolor="#339df6" width="200px" height="340px"> </td> <td bgcolor="#ffcc00" width="700px" height="340px"> </td> </tr> <tr> <td bgcolor="#d2d2d2" width="900px" height="30px"> </td> </tr> </table> the table should look like this I am trying out a couple of layouts for presenting some information in table format. Basically, two tables side by side. Table 1: 3 rows, one column fixed width. table 2: A calendar format with 3 rows. In FF they are displayed as I want them. Even if I include an overflow to force a horizontal scrollbar. Ok I know. But if horizontal scrollbars are not desired, then why do we have them? In IE the overflow is totally ignored. Should I happen to have in table 1, a 4th line of text, then the <hr> I use as a seperator, shows up floating beside table 1, not underneath it as it should. Easily fixed with a <br> but I feel that should not be necessary. In IE, A horizontal scroll bar is not displayed until the data is forced way beyond the edge unlike in FF. Then table 2 drops below table 1 which is not where I want it. In another format, I simply place table 2 under table 1. Which is ok but just doesn't look right. Anyone have a site that discusses this problem and how to work around it so that the browsers are satisfied and the tables show as I want? I'm actually having the same problem I've seen wandering about, and I've already considered all the given advice and nothing seems to be working. The background image is split into a 3x3 table for easier loading, and now I'm getting a small gap between the rows themselves. This is the page: http://akito.clavis-sama.com/ I don't have any <p> tags and my margins are all set to 0 already. Yet I have those lines in the middle of my table for the header image. Any clue as to what the problem could be? For this page on my site: http://www.monkeygambling.com/new%20...ingindex.shtml I am having trouble with the borders on the central part. I have created an external css file with these commands table.border { border-top:1px outset "gray"; border-right:1px outset "gray"; border-bottom:1px outset "gray"; border-left:1px outset "gray"; } td.border { border-top:0px inset "gray"; border-right:1px inset "gray"; border-bottom:0px inset "gray"; border-left:1px inset "gray"; } I want a border with one px width like a normal table, but I don't want the cells to have horizontal borders where the <hr> are. I have got the table to have a border around it, but I want the double line with highlighted edges like in a normal table. If that makes sense could anyone help me? thanks I am working on the webpage: http://www.ashleylandscaping.com All works well, until you click on the "Contact" button. If you look at the other pages, everything is displayed properly. On the "Contact" page you will see a "Contact Us Form". When i have this form/table on the webpage, the whole bottom of the page disappears. If I remove that form from the page, everything looks fine. It must be just 1 or 2 things i'm missing, but I cant see it for the life of me. |
|||||||