|
HTML - Table Background In Firefox
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 Similar TutorialsMy 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 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! 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 I've noticed that *sometimes* my background image won't show up in Mozzila Firefox. My website is he http://www.surrealsource.com. Note that I said *sometimes* so it might download fine for you. But anyway, if you want to see the code, the only relevant part is this: Code: <body style="background-image: url('background.jpg');">
Hi, I'm currently trying to get a submit (post) button to open the target page In a background tab in firefox, i.e. not auto switching to the new tab. I have heard something about firefox not supporting "focus ()" (at least i think thats it, im kind of a newb) due to security reasons, so is there any way around this at all? Thanks, Dani hi, i would like to know if its possible to place a table background image on top of the td color within that table... example he www.tomesrabold.com/levy/thingstodo.html I would like the image at the bottom to be on top of the yellow bar at left. The image at the bottom is the background to the entire table, while the left bar is the background color to the td. Hi, I can't seem to figure out how to have a centered background image in a table in addition to its background color. Here's the site in question: http://deliciousintlbakery.com/test.htm I want to keep the red background in the table, but I also want an image centered behind the text (the address of the cafe). Here's the code: <table width=70% cellpadding="0" cellspacing="0" border=1 align="center" style="font-family: Arial ; font-size: 9pt;" bordercolor="#FFCC00"> <tr><td> <table width=100% cellpadding="0" cellspacing="0" bgcolor="8D2B25" height="250" border="0" style="font-family: Copperplate Gothic Bold ; font-size: 9pt;"> </td></tr> Thanks! Hi everyone, my problem is that I have a table with a background, which shows in my html editor, but when I upload the page, in bluehost, the background image doesn't show. All other images are showing fine except the background images of any table. here's what I'm writing <table width="817" height="172" border="0" align="center" cellpadding="12" background="backsev.jpg" bgcolor="#CCCCCC"> <tr> <td><td align="right"><table width="480" height="145" border="0" cellpadding="0"> <tr> <td valign="left"><div align="justify"> </div></td> </tr> </table></td> </tr> </table> so in this case, after uploaded it only shows bgcolor is is not reading/showing background="backsev.jpg" any ideas? I am trying to have a non repeating background in my table. My table is inside a DIV tag. It works perfect in Mozilla Firefox but not in internet explorer. I know someone on this forum had a similar problem awhile ago but I couldn't seem to fix my problem. I am not the best at coding. This is what I have <table width="800" border="0" align="center" cellpadding="0" cellspacing="0" style="background:url(assets/blob2.png)no-repeat"> Any help would be greatly appreciated How/where can I add a background color to this table? thanks. Code: <TABLE cellSpacing=0 cellPadding=0 width=100% border=0>
<TR>
<TD><font class=tbody>
<form action="/smusermanager/members/default.asp?action=login" method=post name=login language="JAVASCRIPT" onsubmit="return Validate();"><input type=hidden name=todo value="login"><input type=hidden name=url value="/smusermanager/members/default.asp">
<table border=0 cellspacing=0 cellpadding=0 width=95% align=center class=colorformborder><tr class=colorformborder><td><table border=0 cellspacing=0 width=100% cellpadding=0><tr class=colorformborder><td colspan=2><table border=0 cellspacing=1 cellpadding=5 width=100% colspan=2><tr class=colorformheader><td colspan=2><font class=textsize9><font color=white><b>Login Here</b></font></td></tr>
<tr class=colorformfields><td align=center colspan=2><font class=textsize9></font></td></tr><tr class=colorformfieldsalt><td align=right width=50% ><font class=textsize9>Email Address</font></td><td><font class=textsize9><input class=fieldbox type=text size=20 maxlength=50 name="members_username"></font></td></tr>
<tr class=colorformfields><td align=right width=20% ><font class=textsize9>Password</font></td><td><font class=textsize9><input class=fieldbox type=password size=20 maxlength=50 name="members_password"></font></td></tr><tr class=colorformfields><td colspan=2 align=right><font class=textsize9><input class=fieldbox type=submit value="Login" id=submit2 name=submit2></font></td></tr>
</td></tr></table></td></tr></table></td></tr></table></form>
<div style="padding-left: 24px;"> <font face="Arial" color="#000000" size="3"><img src="/images/Hphone.gif" style="vertical-align: middle;"> <a href="?action=login"> Home</a><br><br>
<IMG src="/images/clear.gif" width=1 height=5><br><img src="/images/hphone1.gif" style="vertical-align: middle;"><a href="?action=register"> Register</a><br><br>
<IMG src="/images/clear.gif" width=1 height=5><br><img src="/images/hphone2.gif" style="vertical-align: middle;"><a href="?action=forgotusername"> FAQ</a><br><br>
<IMG src="/images/clear.gif" width=1 height=5><br><img src="/images/hphone3.gif" style="vertical-align: middle;"><a href="?action=forgotusername"> Terms Of Use</a><br><br>
<IMG src="/images/clear.gif" width=1 height=5><br><img src="/images/hphone4.gif" hspace="4px" style="vertical-align: middle;">
<a href="?action=forgotusername"> Contact Us</a><br><br>
<IMG src="/images/clear.gif" width=1 height=5><br><img src="/images/hphone5.gif" style="vertical-align: middle;"><a href="?action=forgotpass"> Forgot Password</a><br><br>
<IMG src="/images/clear.gif" width=1 height=5><br><img src="/images/hphone7.gif" style="vertical-align: middle;"><a href="?action=forgotusername"> Forgot Username</a></font></div>
</font>
</TD>
</TR>
</TABLE>
I'm new to the forum and hope i'm asking in the right place. I have modified some code to break one image into seperate images and display them at different places on a page, but i would like to use one of the images as a background to a table, below is the code (excluding javascript) to seperate one item that i've called Logo and show it on it's own; <body onload="crop('images/New_Logo.png', 'Logo', 0, 0, 960, 99); > <div id="Logo" style="width:960px; height:99px; margin-bottom:20px;"></div> I've tried different variations to show as background but it wouln't work, i was thinking along the lines of <table background="Logo"> .... </table> ok i know it's rough but here the site - basically it runs fine in firefox, chrome, and latest safari and fine on mobile opera etc, but in ie 7 it completely screws the background box on a few tables on a all the pages pages: run this in ie 7: http://www.gospeldesign.co.uk/sb/ view it in chrome to see how it's meant to look, do you think it's something i'm doing in the css? i'm pretty new to this and only just started using css. thanks for any help. Is there a simple attribute for tables that tells it to alternate the colors for every second row? For example, if I want to create a table where the first row background color is grey, the second row is white, the third grey, the fourth white, and so on, is there a simple attribute like "altcolor=grey" or something like that (maybe in CSS)? Hello everyone, I'm new here and currently reaquainted with HTML as I'm trying to help out a friend with his website. I am trying to randomize a background image in a table and I can't seem to get anything to work. I have searched up and down this forum and others, have tried several scripts that seem to work for others, and I'm still at square one. I most recently tried a script I found here on this forum with no success. Here is my code... 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>
...
...
<script type="text/javascript">
<!--
var pic=new Array();
pic[0]="img/home_back1.jpg";
pic[1]="img/home_back2.jpg";
pic[2]="img/home_back3.jpg";
var num=Math.floor(Math.random()*pic.length);
window.onload=function() {
document.getElementById('wrapper').style.backgroundImage='url('+pic[num]+')';
}
//-->
</script>
</head>
<table id="wrapper" width="955" height="600" align="center" border="0" cellpadding="0" cellspacing="0" >
...
...
...
</table>
</body>
</html>
If anyone has any insight as to what I may be doing wrong or how I can fix this it would be much appreciated as I'm pulling my hair out trying to get this to work. Thanks! Unclejunebug Hi everyone, I was wondering whether I can add an alt attribute to a table cell background image. I tried to add it in the code after the image address, but it doesn't work. Is there another way? Thanks! Hello Everyone. The problem I am having and always wanted to know the correct way is . When adding text within a table with a background image and if the text excedes the background image thus increasing the height of the table, the background image repeats. What I want to do is have a solid color repeat at the bottom of the image so the table does not break the image, I want the image not to Repeat but to take on that solid color and repeat that color through the bottom of the Table so I can add as much text as I need. I appreciate any help. I know this is quite common when working with table. Thank! i am trying to call a transparent png as an image background for a table and i have the code to get it to work for IE 6 and IE 7 but when i add in a doctype "<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">" it doesnt work. Here is a section of my code: <style type="text/css"> .stock { background-image: url("BG.png"); background-repeat: repeat; background-position: top; behavior: url('pngbehavior.htc'); padding: 11px; } </style> and then call the table like this: <table width=800 class=Stock> the pngbehavior.htc is the same transparent png attachment that is floating around the net. What i am trying to know is does anybody have a way of calling it so that it works in IE 5, 6, 7 and firefox with the doctype command? it works fine before i put the doctype command in it but i am using some other code that needs it. Thanks guys Hi,, in the attached file .. i was tryin to set image ->contact_13.jpg as the background image for that cell.. as <TD COLSPAN=6 background="images/contact_13.jpg"></TD> but its not setting it correctly .. the path and name of image is correct .. as far as i see it .. <td background='xyz.jpg'></td> works .. is it because of the colspan thing .. Greetings, This is my first post... I'm a novice web developer and pro drummer running www.ProMusicTeachers.com. The site is php/mysql, we have a search function smack in the middle of the index page that is set up as a <table>. The table should have a background image... this is the code I'm using is <table border="0" bgcolor="#FF9900" background="/images/searchgraphic.jpg" align="center" cellspacing="3" cellpadding="0" width="617"> to create the table, then comes the form. However, the background image shows up only in Safari, but not IE or Firefox. This seems like a very simple tag... and I swear last night it showed up in Firefox too but this morning will not. Any suggestions? Much thanks, Brian Hey all! I would like to create a 3 row table with a background color in each row. On the right side of the table I would like to display an image that sits on top of the background color and spans all 3 rows. When I try to do this it seems that the row bg colors go OVER the image. How can I get the image to sit on top of the 3 row bg colors? I don't know any other way to do this but I'm definitely open to suggestions! Thanks for any help! This is the code I've been trying: Code: <TABLE cellpadding="0" width="200" cellspacing="0" border="0" style="
background-image:url(ask.gif);
background-position: top right;
background-repeat: no-repeat;">
<tr bgcolor="#FBE9D1">
<td> </td>
</tr>
<tr bgcolor="#F7D5A7">
<td height="20">ask a question</td>
</tr>
<tr bgcolor="#FBE9D1">
<td height="28"> </td>
</tr>
</TABLE>
|
|||||||