HTML - Web Browser Display Issues
One of the pages on my website shows up differently in Firefox than it does in other web browsers.
Here is what it looks like in the following browsers. Google Chrome, Safari: Firefox: One of the most noticeable problems is that in Firefox, the form's submit button is missing. If you would like to look at the html code, the url is Nmacro.com/Contact.html. Also, I used iWeb to create my website. Thanks so much. Similar Tutorialswell, im using these weird codes to make my site look the way i want... but it only works in some broswers. i need a much more compatible code. any help? ok well i worked this out. but it dosent seem to work properly in some browsers. its all acceptable w3. please help... <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML><HEAD><TITLE>Get Lit, A Clothing Company</TITLE> <META http-equiv=content-type content="text/html; charset=ISO-8859-1"> <META name="keywords" content=""> <META name="description" content=""> <STYLE type="text/css"> #main {position:absolute; left: 400px; top: 245px; width: 700px; height: 700px; z-index: 100 } img.floatLeft { float: left; margin: 4px; } img.floatRight { float: right; margin: 4px; } </STYLE> </HEAD> <BODY bgcolor=FFFFFF> <P align=center> <TABLE cellSpacing=0 cellPadding=0 width=900 border=0><TBODY><TR><TD align=center valign="top"></TD></TR><TR><TD align=center valign="top"> <A href="http://www.freewebs.com/stevenwang/home.htm" target=main><IMG alt="" src="http://www.freewebs.com/stevenwang/gohome.gif" border=0></A><IMG alt="" src="http://www.freewebs.com/stevenwang/spacer.gif"><IMG alt="" src="http://www.freewebs.com/stevenwang/spacer.gif"><IMG alt="" src="http://www.freewebs.com/stevenwang/spacer.gif"><A href="http://www.freewebs.com/stevenwang/blog.htm" target=main><IMG alt="" src="http://www.freewebs.com/stevenwang/nav_001.gif" border=0></A><IMG alt="" src="http://www.freewebs.com/stevenwang/spacer.gif"><A href="http://www.freewebs.com/stevenwang/catalog.htm" target=main><IMG alt="" src="http://www.freewebs.com/stevenwang/nav_002.gif" border=0></A><IMG alt="" src="http://www.freewebs.com/stevenwang/spacer.gif"><A href="http://www.freewebs.com/stevenwang/about.htm" target=main><IMG alt="" src="http://www.freewebs.com/stevenwang/nav_004.gif" border=0></A><IMG alt="" src="http://www.freewebs.com/stevenwang/spacer.gif"><A href="http://www.freewebs.com/stevenwang/contact.htm" target=main><IMG alt="" src="http://www.freewebs.com/stevenwang/nav_005.gif" border=0></A><BR><P align=left><IMG alt="" src="http://www.freewebs.com/stevenwang/splice1.gif" class="floatLeft"><P align=right><IMG alt="" src="http://www.freewebs.com/stevenwang/content.gif"></P></TD></TR></TBODY></TABLE> <TABLE cellSpacing=0 cellPadding=0 width=900 border=0><TBODY><TR><TD align=right valign="top"></TD></TR><TR><TD align=right valign="top"><iframe id="main" src="http://www.freewebs.com/stevenwang/home.htm" name="main" style="width:600px;height:600px;margin:0px;" frameborder="0" scrolling=no></iframe></TD></TR></TBODY></TABLE></BODY></HTML> Hi All - Check out www.theSalve.org/flashVid.htm - Any ideas why the layout is different in Explorer and Firefox or even Safari and Opera for that matter. I realize I'm not using CSS. Don't know how to yet. Anything I can add to make it look the same on all browsers? Hi, I'm new around here and need some help I've been dabberling with web development since 98 (had a rather large gap when pursuing a more artist approach but that's another story!) Recently I have been trying to launch an online apparel company myself and my partner have been working a site relaunch over the past fortnight and have stumbled across a huge problem that neither of us can rectify. Our site www.n-brio.com works picture perfect in chrome, safari and ie 8 but not in opera or firefox! Now the kicker is locally on both our computers it does but as soon as we look at it remotely thru those browsers half the site is not being recognised. We have checked code and even tried a different web host and still no head way! Are we missing something really obvious? Any suggestions would be amazing. Cheers Knatalie i have resolved this thanks Hi - Just wondering if anyone can help me figure out layout problems on the following page: www.marchgallery.com/comments.php I'm designing on a mac, and everything looks good in Safari. When I open up in Firefox, though, the comments are way below the intro text and the layout of the submission form is all messed up. I've never experienced this much difference in appearance between these two browsers. Maybe someone (nearly all of you) are viewing on PC? How does it look on that end? I'm really at a loss here. Any clues or suggestions would be much appreciated! Hey, I'm having a small problem with cross browser compatibility. In Internet Explorer my site looks exactly the way I want it to, no problems. However, in Firefox and Opera there is a space between the navigation and the content. I investigated my code and can't pinpoint the problem. Can you tell me what it is? So if you could just tell me the problem with no example, URL, or code that'd be great. I'm just kidding. The URL is TeamFlank.info. Here is some screen shots of it... IE: *click to enlarge* FF: *click to enlarge* Hello, I designed this website http://www.aitputd.org/conference and found that it has compatibility issues when viewed with different browsers. e.g. The 'font' of the menu changes (becomes bold) when viewed in IE and Chrome browsers as opposed to FF3.5 Also The title 'sponsors' on the left does not stay at the center in IE and FF3.5 but seems good in Chrome. Is there a solution to address these problems?? Any help is highly appreciated. Regards, NP Hi, I am working on my website with my limited knowledge of HTML. As I am using frames I've found that my website will not appear in some browsers (namely firefox, which I find unusual as its usually excellent). It works fine in safari (i'm on a mac). the site is www.sambrewster.co.uk I'm creating a noframes site too so the option is there. I thought it might have something to do with the character encoding? Any help or pointers would be excellent! Just to know where I've gone wrong would be great. Thanks very much Hello. =) I'm trying to create a small website for my family, and I want to incorporate this drop-down menu from Sons of Suckerfish. I had some help altering the menu a bit, but I'm still having a few problems. =( I'm testing my site in as many browsers as possible, and I came across two major problems: Problem #1: The Top Menu It doesn't work in IE6. The menu keeps jumping VERY far to the right. Also, the words "Home", "By Year", etc. should change color when hovered on. You can observe the differences between IE6 and Firefox below, in these images I made: Menu (mouse issues; example #1) Menu (mouse issues; example #2) =================================== =================================== Problem #2: The "Thanks" Section My "Thanks" section isn't looking right, either. For some reason, Netscape won't space the image away from the text: Image (how "Thanks" page looks in IE, Firefox, and Netscape) I know Netscape Navigator is pretty much "extinct" now, but I'm still curious to know what the problem is. I'm guessing the problem is the "display: inline-box" code in my DIV tag. Is there another code I can use to fix this problem, or maybe there's a hack I can use for Navigator? Or...should I stop using DIVs and acheive the same effect another way (like with a table or something)? I really hope someone can help. Thanks in advance! Hey, I'm having issues with coding a website to be cross-compatible with Firefox and Internet Explorer (views fine in Firefox). I'm a BS artist when it comes to web design, and I could really use some help. The site is at this address: www.thepynebros.com It views correctly in Firefox, however, Internet Explorer distorts the font sizes, and will not wrap the CuteNews script around the picture of the trees on the index page. Can someone help me out? What am I doing wrong? Heya, I'm working on my new website design for http://nickerson.biz and all was going good. Came to the point where I check compatibility in all browsers. Figured everything would be fine since its 100% xhtml transitional valid. Turns out IE ****s it up real bad. Has 5 noticeable things that SHOULD NOT be happening. Site looks great in FF, but IE... I can't figure out whats going wrong. http://i42.tinypic.com/nntyly.png Ideas? View source to see coding, all seems fine. Hello, quick question here. I'm working on this site: (replace @'s with a's) v@rd@burstyn.com/version2/ The previous designer left it in a bit of a mess, and now that I've made some changes that appear nicely in my Safari browser, the tables are hugely misaligned when I look at a number of the pages in Firefox (i.e., water.html or rites.html). Any advice as to how to get the tables back under control? I've tried for a while but nothing seems to fix it. Thanks very much in advance. I have a nice little HTML5 demo that plays a video in a canvas that is not displayed. As part of the demo, I copy "frames" from the hidden canvas into a resized canvas that is displayed. My "custom" code to manipulate the video frames works fine. What doesn't work depends on the browser, but also the source of the video. If the source of the video is on the local disk along with the html file, it plays fine and it loops fine in both Safari, Chrome. Opera and Firefox. If the source of the video is on the web, either as a local (to the website) where the html file is stored, or if the html file is local but the video is on the web, then Safari works fine. Chrome displays the video ONE time and then stops. The loop does not work. Remember, same code, works fine if all data is local. Changing the source URL of the video to a website is the ONLY change. Opera and Firefox do not display anything except the box rectangle when the video source is on the web. Firefox gives the error: Quote: Error: uncaught exception: [Exception... "Component returned failure code: 0x80040111 (NS_ERROR_NOT_AVAILABLE) [nsIDOMCanvasRenderingContext2D.drawImage]" nsresult: "0x80040111 (NS_ERROR_NOT_AVAILABLE)" location: "JS frame :: file:///Volumes/Olorin/sliceNdice/demow.html :: processFrame :: line 34" data: no] No errors show up in Opera, but no video is displayed. The Code: (or a snippet, actually) Code: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html><head><title>HTML5 Video Deom</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script type="text/javascript"> var video; var copy; var copycanvas; var draw; var VID_WID = 640; var VID_HIGH = 360; var OUT_WID = 480; var OUT_HIGH = 320; function init(){ video = document.getElementById('sourcevid'); copycanvas = document.getElementById('sourcecopy'); copy = copycanvas.getContext('2d'); var outputcanvas = document.getElementById('output'); draw = outputcanvas.getContext('2d'); setInterval("processFrame()", 33); } function processFrame(){ //get video image copy.drawImage(video, 0, 0); // manipulate image here draw.drawImage(copycanvas, 0,0); } </script></head> <body onload="init()" style="margin:0px;"> <div><br/><br/></div> <div style="display:none"> <video id="sourcevid" autoplay loop=loop> <source src="http://catalystart.reststop.com/html5/BigBuckBunny_640x360.mp4" type="video/mp4"/> <source src="http://catalystart.reststop.com/html5/BigBuckBunny_640x360.ogv" type="video/ogg"/> </video> <canvas id="sourcecopy" width="640" height="360"></canvas> </div> <div> <canvas id="output" width="480" height="320" style="border: solid 5px #666666"></canvas> </div> </body> </html> Works if all files are local, shows box outline if all files are on the web: Code: <video id="sourcevid" autoplay loop=loop> <source src="BigBuckBunny_640x360.mp4" type="video/mp4"/> <source src="BigBuckBunny_640x360.ogv" type="video/ogg"/> </video> Fails: Code: <video id="sourcevid" autoplay loop=loop> <source src="http://catalystart.reststop.com/html5/BigBuckBunny_640x360.mp4" type="video/mp4"/> <source src="http://catalystart.reststop.com/html5/BigBuckBunny_640x360.ogv" type="video/ogg"/> </video> Note: Safari works in both cases, as long as all files and website are reachable. Chrome works to play the video ONCE, then stops. Firefox and Opera show an empty outline, but no video. I'm not a cross-browser expert. I will accept any and all possible solutions to try. In the meantime, I will continue to see if I can find the problem. Obviously, I want it to work from a website. Guys, Please help me. Following website www.blaizekitchens.co.uk Looks fine in Mozilla But goes horribly wrong in iexplorer Can't work out what the hell is causing this! Can someone please point me in the right direction Cheers Damon Firefox looks fine. Internet Explorer looks rather dumb. 1. Alignment is off 2. One of the links doesn't work 3. Within the site, the main content box adjusts itself according to text (please click reddish image to see) Does anyone know how I can fix this? (I'm sure many people have had this problem. I suppose I could use image map on the main page- that would solve #1 & 2. But I'm at a loss about #3.) Thank you very, very much! http://www.geocities.com/rk.grant/ How to display < > in browser using HTML ? I modified text on a web page yesterday for a client and added an image to it as well. I simply copied existing code that was to be commented out, modified the text and image file name, commented out the previous code and then uploaded the file, via FTP, to the server. On my machine it looks terrible when I go to the client website and access the page via their link. All of the horizontal lines are at the top instead of between sections as it should be. However, if I just double click the HTML file directly it opens fine. It also opens fine on a co-workers machine regardless of how he does it. The client sees it fine too. I have not been able to find a reason why this is happening and I went back through the code twice more, redoing my work, to make sure I was not commenting something out that shouldn't be. I use I/E 8 and my co-worked uses I/E 6. I don't know about the client but since I can see it fine when I double-click the file itself I don't think that is the issue. Any assistance would be greatly appreciated as we do updates for this client pretty regularly. Thanks, Doug Hey guys. Having some issues on both my website and one I did for my Brother, the images not aligning properly. Both are fine in Firefox, but not in IE. www.michaelsingleton.co.uk www.ucba.co.uk If anyone would be so kind as to have a look over the code, it would be much appreciated! Thanks Mike. Hi guys, I've been working on a website for a friend for a while now and thought I had it complete. That was until I opened it with IE! Things don't look right in IE - and also IE crashes when some pages are loaded. Any chance you could look at this page: http://www.flatvision.name/de/index.php in both IE & Firefox and offer some advice as to why it does what it does? Thanks very much - help and advice much appreciated. ! Leigh So I'm not completely new to html website design, but I am building a site and was just going to throw up a banner and some text saying coming soon. So the text displays fine. But I cannot for the life of me figure out how to get the images to display. I have checked and double checked the source code and it should be fine. I manually logged into my ftp and the file is in the directory so it shouldn't be an issue of not being able to find it. Can I get any help at all? Here is the link: http://www.huntlink.net my code is as follows: <!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=utf-8" /> <title>Untitled Document</title> </head> <body> <table width="800" border="0" align="center"> <tr> <td><img src="images/mainbanner.png" width="800" height="150" /></td> </tr> <tr> <td align="center"><h2>Coming Soon!</h2></td> </tr> </table> </body> </html> Any help would be great. I don't know why the image isn't displaying. It works when I preview it in dreamweaver also. |