HTML - Table Background Browser Issue
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 Similar TutorialsIE8 and Chrome display this as I would like. Firefox does something strange: any cell that doesn't have a corresponding cell in the next row down will be extended into that row. Any ideas? HTML 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><title> Untitled Page </title> <link rel="Stylesheet" type="text/css" href="/SMSTool.NET/css/StyleSheet.css" /> <style type="text/css"> table{ border-collapse:collapse; border:solid black 1px; } td, th{ border:solid black 1px; } </style> </head> <body> <table> <tr><td>TD</td><th>TH</th><th>TH</th><td>TD</td></tr> <tr><th>TH</th><td>TD</td><td>TD</td></tr> <tr><th>TH</th><td>TD</td><td>TD</td></tr> <tr><td>TD</td></tr> </table> </body> </html> If anyone can help with this problem I would be very grateful. It's a problem I notice on a fairly regular basis so I guess I am over looking something when I am working with tables. Basically my table sizes look completely different in IE than they do in Firefox. Here is an example of a table I'm working on that appears massive in firefox yet is keeping its correct dimensions of height 287 pixels in IE. http://www.orolin.co.uk/prices.html Can anyone shed any light on this problem?. It would be much appriciated. Many Thanks, Jamie I have studied my code and for the life of me can't figure out why the header is not showing up in IE7 (windows). It shows up in all other browsers just fine. Can someone help me and take a look at my code and tell my what I may have missed? http://www.kingcrabshack.com/ Thank you for your time. Hi, I've get this website http://jigsawpropertiesuk.com and it looks perfectly fine in firefox but once you use internet explorer thats when things start going wrong. the login/register thing at top is moved all the way to the right and so is the right fade picture. In addition near the bottom of the page where the posts are located the text is out of position. I have no clue what so ever why its doing this since I've never had this issue with other websites. The css is located he http://jigsawpropertiesuk.com/wp-con...ties/style.css Any help is appreciated Hi all, I created a HTML page with CSS. While i ran the code in IE 8.0, the alignment was in order. But when i ran the same HTML code in other lower versions of IE, i am facing some alignment problem like submenu arrangement, displacement in the page contents. Please anybody suggest me with a solution. What is that i should do to rectify it.. Thanks and Regards.. i have created / installed a new drop-down menu. i would like the menu to stretch 100% of the header / page, but, when i resize my browser i dont want the menu to resize along with the page. i want it to stay static and not resize as it is messing up the menu. if you have a look at http://www.bmwgallery.co.uk/ and resize your browser around abit you will know what i mean. please i hope somebody has a simple fix. many thanks Hello folks. I have been trying out this site as a beta for a hockey team. I am developing a site and have an issue with ONE page in particular. Every other page looks great! http://web.mac.com/chris.ducasse/force_beta/staff.html That is the culprit. I have looked over the source code, and cannot find anything that would cause it. What happens, if you don't see it, is that the page does not take the entire site width, it wraps the text at about 2 inches or so away from the right edge of the page. Any help is appreciated. Also, I got the navigation bar (modified it myself) from Open Source Web Design and want to give the artist credit - where do I do that in HTML code? Thanks again. Hi, I have had a new template developed for osCommerce, most browsers display the site correctly such as Firefox but Internet Explorer has some issues. IE shows the site as being aligned differently with some other design issues. I think it may be a problem with the stylesheet. My domain is InkRound.co.uk Here is the CSS code from stylesheet.css My site is using a HTML based template with osCommerce. ive put a background in to my html document that stretches to fit the size of the browser window. heres the code: <style type="text/css">html {height:100%;}body {height:100%;margin:0;padding:0;}#bg {position: absolute;top:0;left:0;width:100%;height:100%;}#content { position:absolute;z-index:1; width:100%;}</style> <!--[if IE 6]><style type="text/css">html {overflow-y:hidden;}body {overflow-y:auto;}#bg {position:absolute;z-index:-1;}#content {position:static;}</style><![endif]--> <script type="text/javascript" src="swfobject.js"></script> </head> <body bgcolor="#000000" text="#999999" link="#999999" vlink="#999999" alink="#999999"> <div id="bg"><img src="NJWwallpaper01.jpg" width="100%" height="100%" alt=""></div> <div id="content"> First Post! Yeah now thats out of the way... I've just designed a Linux Tutorial site for a friend who is a Linux fanatic. However, I've used Arial as the font. When the site is viewed in Linux (I think its the Mozilla browser) it appears in this odd font. I was wondering if anyone knows which fonts Linux broswers display best - so I can assign it to the 2nd choice in the CSS. Arial being number1 for Windows browsers, then going to the 2nd choice if its Linux and it cant find the Windows font. Any help whatsoever would be appreciated. Thanks! Please help me make my menus compatible in more than just firefox... aka Safari and IE lunch dinner thank you! When you go to my site www.sforu.com with IE 6 or IE7 the picture is all misaligned, So could you take a look and let me know whats wrong with it, because it's driving me crazy Thank you Using AJAX & php to return a randomly generated number of single column tables, and drop them into a <div> element. ( http://www.thegreatmartinicompany.co...ace-value.html ). I've set the div to text-align: center, and put auto margins on the tables. The result is the tables are centered and equally spaced in the div element regardless of the number of tables returned. As appropriate FF and IE display the tables side by side, but Safari stacks them on top of each other. An example of the returned code is below. Any ideas why Safari does not display this as IE and FF do? <table style="margin-left:auto; margin-right:auto"><tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> </table> <table style="margin-left:auto; margin-right:auto"><tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> </table> <table style="margin-left:auto; margin-right:auto"><tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> <tr><td></td></tr> </table> Hi the website is showing up fine but there should be a repeater background image , and it doesnt show up in browser at all . Been working on it for 4 hours now. Please help me.. website link: http://extramoney.net16.net/instructions.html What do you need to fix ? Html code ? Image name: repeater.jpg and it is uploaded to hosting space . Thanks in advance for answers , Michael I created a simple table with 2 rows 2 columns. I minimize the browser window into smallest window and I noticed that It screwing up my tables and the contents of it. They get squeezed as I resize the IE windows. How can I make the tables and its contents not to resize with the windows? Please help. i want to know if i can make the background of this applet transparent to see the body background instead of a color <body background ="image.jpg" >(this is what i want to see and just the text of the applet if it is possible ) <p ALIGN="LEFT"> <applet CODE="starmenu.class" WIDTH="240" HEIGHT="1000"> <param name="demicron" value="www.demicron.se"> <param name="reg" value="A00037"> <param name="displace" value="1"> <param name="background" value="000000"> <param name="foreground" value="0000ff"> <param name="shadow" value="ff0000"> <param name="target" value="newbrow"> <param name="horizontal" value="Yes"> <param name="font" value="arial"> <param name="fontsize" value="20"> <param name="italic" value="Yes"> <param name="bold" value="Yes"> <param name="item0" value="blablabla"> <param name="url0" value="http://ep.html"> <param name="item1" value="blablabla"> <param name="url1" value="blablabla.html"> <param name="item2" value="blablabla"> <param name="url2" value="http://blablablal"> <param name="item3" value="Email"> <param name="url3" value="mailto:.com"> </applet> </p> ps: i took this from javafile.....not mine Thanks guys! Hello, Was wondering if any one could please help me on this problem thats been hurting my brain for days. I deisgned a site for a friend orginally done the artwork in PS then sliced it up and over into dreamweaver. I ran over the code made sure every thing was ok I got rid of the <img> tags and put the graphics in as cell backgrounds except for the 2 links on the site which i left as anchored image tags, everything works fine but only in Firefox. As soon as you view the site in IE the links push the other cells down by a few pixels destroying the table layout. This only happens in IE for sum reason i have made sure that there are no borders around linked images in my style sheet and checked and re-checked the html. Please can someone cast an expert eye over the coding and see if there is a solution to this annoying problem. I hope this isnt too long and stupid as this is my first real post so if there is anymore info u mite need just let me know thank you. i was going to try to get my background to stretch but im running into too many issues with it, im wondering if any1 can help me get a background image start at top:150 left:280 here is what i tried so far with no luck:: <body background= image.gif position:absolute; top:150; left;150> doesnt work... so i tried setting up a div to call this into play... <style type="text/css"> #bg {position:relative; top:150; left:150;} </style> <div id="bg"> <body background ="background.gif"> </div> i also tried calling it with out a div threw the body and if i remember the image showed correctly but this time my page started over 150 x 150 px maby the image was just set as background tiled and wasnt even in the right spot i really dont know if any1 can please help me with this issue i would greatly appreciate the help thank you Hi People, Another issue I am having with background images using div tags carrying on a little from http://www.htmlforums.com/html-xhtml...es-123021.html Although I can insert the background image now it does not appear to be taking much notice of the background image position or repeat elements. I could make life allot easier for myself and use a different method but wanted to learn this method. Any ideas why it would not take notice of my background positioning or repeat request? HTML Code: Header information and then........ </head> <body> <div id="content"> <div id="image1"><img src="images/image1.jpg" alt="image description"></div> <div id="image2"><img src="images/image2.jpg" alt="image description"></div> </div><!-- end #content --> </body> </html> CSS PHP Code: } body { width:100%;height:100%;margin:0;padding:0;background-color:#cccccc; } #content { width:100%;height:100%;margin:0;padding:0;background-color:#cccccc; } #image1 { background-image:url('images/image1.jpg'); background-repeat:no-repeat; background-attachment:fixed; background-position: right bottom; } #image2 { background-image:url('images/image2.jpg'); background-repeat:repeat-y; background-attachment:fixed; background-position: center; padding-left: 6px; } Adding the padding above does make the image move along with margins which i added for testing only but I obviously have something else not quite right here. I added sizes to the body and content as I was experimenting. Do I really need them, if so what is the recommended code to put in? Thanks all I know IE7 sucks but i need my website to be viewable in it. First look at my site in Firefox, then IE7 if you have it. The menu shows up properly in firefox, but not in IF7. Any ideas how to make IE7 show the menu properly? Thanks link: http://www.dynamitedave.com/redesign/index_1.html |