HTML - Firefox Compatibility Problem
Hello all,
I've just made my first website, and tested it initially in IE 8 and then viewed in Safari, Chrome, and Firefox 3. It displays perfect in IE, Safari and Chrome, but Firefox has some quirks! Issue 1: My bordered pictures are displaying a blue border, which is yellow in the other browsers. Though they are also links, other non-bordered picture links don't have it, and I have set the links colours in the CSS to be yellow and grey anyway (which works fine for the text links). Issue 2: Small images next to each other won't sit side by side, they jump to the next line. Both these issues can be seen on this page (if viewed in Firefox, naturally!): http://www.swingcopation.co.uk/whatwecando.html Any ideas would be greatly appreciated! I can post the code for the page if required. Thanks, Nubbin. Similar TutorialsHi My use of HTML is pretty basic but adequate. On my charity website it appears OK in I.E. which I think I'm right in saying accounts for around 95% of users (?). However I find that in a Firefox browser my textural content is inconsistent, using a different (default?) font to my Verdana, and not resulting in the same size as used in the I.E. structure. Trial and error on the Firefox browser gets it right there, but then wrong on I.E. Is there (for starters) one (or more) tag(s) to a) set a default text in the Head for say Verdana Bold Size 2 colour #330099, then if so b) how to change size for any variations in body. Will welcome any advice on this matter. willemm i made a website and everything looks good on it when i view it in firefox but when i use explorer some of the images wont show up, just has the red x in the corner. any suggestions whats goin on? Hey everyone. I just stumbled upon another little problem: I think the picture talks for itself: http://i23.photobucket.com/albums/b3...enoctrober.jpg This is the way it comes up in Mozilla, doesn't do that in IE though. Help? Hello, Still looking for someone to help us solve the problem we are having with our website. www.random-rocks.com the buttons, etc... only work in Internet Explorer and NOT in Firefox ? Need someone to see source code and let us know WHAT AND WHY ? this is happening? We did get a response, but tried it and doesn't seem to be the answer, unless we are not doing something right. PLEASE, PLEASE HELP US. a.s.a.p. THANK YOU Hi, I am in the process of building a website for a client. This is my first ever site so I knew I would have a few issues. I have fixed all but one at present. Here is a link to my site which I have put live on a test server. http://leaf.greenxtian.com/grangefarm/index.html The naviagation bar and Lightbox2 images are moving when rolled over. This only happens in Internet Explorer 8. It is fine in FireFox and other browsers. It is only on the Services/Facilities Pages so I think it may be an issue with the CSS for Lightbox2? Maybe how I have set it up or just a bug in the coding? Does anyone know why this is happening? If so, do you know of a fix? Any help would be greatly appreciated as I have spent hours trying to work this out. I'm currently working on my site but I'm stuck on a IE8 compatibility error. Here is the link: http://www.mym2webdesign.com/campustitle/shannon.html This is how IE shows the page: http://img338.imageshack.us/img338/10/iesucks.jpg In every other browser the page works fine, but when I tried it on IE8 the text overlaps. I've spent hours trying to look for a solution but no success. If anyone knows where the problem please let me know! Thank you for you time! Hello, When i am viewing our site with IE9 compatibility mode or old versions of IE then the twitter feed at the bottom of the page is misplaced. http://www.greekconcierge.com/ Any ideas on how to fix this? many thanks, Andy Hi everyone. New to the forums and thought I could get some help with regards to my personal website http://judyhuynh.ca Anyways, the problem is the browser compatibility. Just when I thought everything looked OK, I checked it out on my other browsers (Chrome, Firefox, Safari, Opera) but there was one problem with IE. I use Cutenews for blogging and it does not show the line breaks in between paragraphs and it does not show my .png profile picture on the left of the sidebar where there's the quick bio. http://browsershots.org/http://judyhuynh.ca/ Line breaks in Cutenews are generated automatically when typing paragraphs. So I don't know and the .png thumbnail on the left, nooo idea about that. It irritates me because it just looks so ugly on IE, ahha and some people still use that 'not-so-great' browser. Help is much appreciated!!! I'm new to web design so I hope this makes sense to someone. I am trying to make a website for a new buisness, I'm using text wrangler on a mac to write the code and have been checking my progress in Safari. I have just checked the site on firefox and the banner at the top isn't showing up? This is the html: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Peris & Corr</title> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1"> <link rel="stylesheet" type="text/css" href="styles.css" /> </head> <body> <div id="container"> <div class ="img"><img src= "logowebsite.jpg"</div> <div id="wrapper"> <div id="content"> <p><strong>What we do:</strong></p> <p>- create a range of hand made textile products and greeting cards <p>- offer an eco frienly screen printing service, printing only with water based inks on to ethically sourced garments</p> <p>Montegeraliquam sed pede in cursus praesenec vestas rhoncus wisi at wisi. Condisseloborttis enim et ipsum mauristie id felit adipiscipit ac auctortorttitor sempor. Vitantesqueat sempus non sed et mus sit vivamus purus netus hendiment. Pretiuma diam et id tempus dolor por wisi sed volutpat facilisi.</p> <p>Wisiet sus adipit phasellentum elit condissim consecteturpiscing sapien vivamus et congue. Utvel tris quismod cursus liberos elit nisse curabitur tur parturpis tellenterdum. Semperligula curabitae tellentesque nulla trices vestas ristibulum id justo auctor facinia. Natisdonec consequat nibh pellus.</p> <p>Vestibusodio euisque id elerisus lacus tincidunt sit malesuada lacus pellus parturpiscing. Pellenterdumat maecenatoque cras a magna nibh et quis diam ames et. Laoremvolutpat ac dolor eget eget temper lacus vestibus velit lacus venean. Magnaipsum tellus morbi leo aliquat nulla convallis pellentesque.</p> </div> </div> <div id="navigation"> <ul> <li><a href="home page.html"><strong>home page</strong></a></li> <li><a href="products.html"><strong>products</strong></a></li> <li><a href="screen printing.html"><strong>screen printing</strong></a></li> <li><a href="about us.html"><strong>about us</strong></a></li> <li><a href="stockists.html"><strong>stockists</strong></a></li> <li><a href=http://perisandcorr.blogspot.com/><strong>blog</strong></a></li> <li><a href="contact us.html"><strong>contact us</strong></a><li/> </ul> </div> <div id="extra"> <img src= "bags.jpg"> <img src= "ink.jpg"> </div> <div id="footer"> <p>Footer</p> </div> </div> </body> </html> I hope someone can help, and that there is a simple solution. Thanks Hi all. I'm very new to html/css code, but have managed to create a decent looking webpage so far. Well, up until last night anyway! I added three text images to my page, and it looks good when viewing with FireFox. It use to even look ok when viewed using IE, but now my NavBar is all screwed up, and the header image will not show. Could someone please take a look at the source code, and my style sheet, and let me know what could have went wrong? Thanks! Hi, <input name="Submit2" value="1" type="image" id="Submit2" src="images/Freshupdaterecordbutton.jpg" alt="Update" width="160" height="50" border="0"> The above image is a button within a form. If I click on the button, I can check the parameters passed via the form. The following tells me how long the "Submit2" parameter is using ASP strRequest = Request.Form("Submit2") strRequest = len(strRequest) response.Write(strRequest) Response.end() In Firefox 2, the length of "Submit2" is 1 In IE 7, "Submit2" is 0 I need them both to be 1. How can I do this? Is it something to do with the NAME and ID tags? The NAME and ID tags are unique on the form. Cheers, Alski Hi, Ive got a bit of a problem with the website im creating. This is the bit of code thats affecting the browser (I believe). <div class="header"><img src="truelogo.gif" /></div> For some reason It works perfectly in safari, but not in IE or firefox. I wont post all the source code here as there is quite alot, but the website is alesofdevon.com/betatest/mysql.php?id=1 if you need anymore info from it. Thanks Scott. How do I get the Content Management System Admin features: block to move down slightly. It looks fine in IE but firefox its not looking right http://www.upfrontdesigns.co.uk/build/services.html hi all, recently i'm making a site and i have made a link to go to you last page using java script. but when i hover over it in interneet exporer my cursor turns in to a hand but when i hover over it in firefox nothing happens. the code i use to get the hand is "style="cursor:hand" ". can someone pls help me ? ty Hello all, I'd like to say this is my first post here on this forum and I am in need of some help... I have a website that I am re-programming / designing because when I started it I was not as good as I am now at development (I'm currently 16 years old) The problem is in HTML and I can't figure it out to save my life... I have 3 tables in HTML on my homepage, one is for whether or not the person is logged in, tells them to login to use features. Another for image links for main areas of the website Another for statistics... In firefox it does what I want: In IE, I get this interesting error... Source: Code: <table width=810 align=right cellpadding=0 cellspacing=0 border=0> <tr> <td> <!-- IF NOT_LOGGED --> <table width=810 align=right cellpadding=2 cellspacing=0 border=0 align=right> <tr> <td class="urgent" width=20><IMG src="{STYLE_DIR}images/icon_urgent.gif"></td> <td class="urgent">You must be <a href="login.php">logged in</a> to use the features of this department.</td> </tr> </table><br> <!-- ENDIF --> <table width="810" height="30" border="0" cellpadding="0" cellspacing="0" align=right> <tr> <td width=5 class="row2"></td> <td> <img src="{STYLE_DIR}images/goal_sigs.jpg" width="200" onMouseOver="this.src='{STYLE_DIR}images/goal_hover.jpg'" onMouseOut="this.src='{STYLE_DIR}images/goal_sigs.jpg'" height=30></td> <td> <img src="{STYLE_DIR}images/stat_sigs.jpg" width="200" onMouseOver="this.src='{STYLE_DIR}images/stat_hover.jpg'" onMouseOut="this.src='{STYLE_DIR}images/stat_sigs.jpg'" height=30></td> <td> <img src="{STYLE_DIR}images/rank_sigs.jpg" width="200" onMouseOver="this.src='{STYLE_DIR}images/rank_hover.jpg'" onMouseOut="this.src='{STYLE_DIR}images/rank_sigs.jpg'" height=30></td> <td> <img src="{STYLE_DIR}images/develop_sigs.jpg" width="200" onMouseOver="this.src='{STYLE_DIR}images/develop_hover.jpg'" onMouseOut="this.src='{STYLE_DIR}images/develop_sigs.jpg'" height=30></td> <td width=5 class="row2"></td> </tr> </table><br> <table width=810 align=right cellpadding=2 cellspacing=0 border=0> <tr> <td class="row1" colspan=2>Signature Database</td> </tr> <tr> <td class="row2">Total Signatures Created: {TOTAL_SIGS}</td> <td class="row2">Total Members: {TOTAL_MEMBERS}</td> </tr> </table> This file runs off a template class I built so that would help explain {VAR} and stuff such as that. Any help please? Why is IE being stubborn and firefox not? I'm designing some UI modules that are quite small, and have to be. Each represents an NFL football player and inside the module is the ability to add a note to a player. The problem is, the hyperlinks in my UI modules become almost unclickable in Firefox and I'm not sure why. My guess is they are too close to the edge of the container, but it'd be nice if I could find a workaround. Unfortunately space is at a premium You can see the phenomena here. Try clicking on the 'create note' hyperlink on the first player, the 'save note' hyperlink on the second player, and the 'edit note' on the third player. Any advice would be appreciated. Can someone please help me and shed light on this? TIA!! I'm building an ecommerce site and there are 4 thumbnails that you can click on, then the main image swaps to the thumbnail you just clicked on (like how most ecommerce sites work). But I won't have 4 thumbnails all the time, maybe 2 or 3 but maximum of 4. When I test the page with 4 thumbnails, it works fine. But if I have only 2 or 3 thumbnails, the spacing looks odd on Firefox. (Looks perfect on Safari) I want them to be always left justified but they look like they are forced to be centered in the space given. What am I doing wrong? I appreciate any help! The following code is for the thumbnail: Code: <tr> <td width="60" align="left"><a href="#" onClick="javascript:image_click(1);return false;"><img border="0" src="thumbnail.asp?file=[image1]&maxx=60&maxy=0" name="pimage1"></a> </td> <td width="5" align="center"></td> <td width="60" align="left"><a href="#" onClick="javascript:image_click(2);return false;"><img border="0" src="thumbnail.asp?file=[image2]&maxx=60&maxy=0" name="pimage2"></a> </td> <td width="5" align="center"></td> <!--END: image2--> <!--START: image3--> <td width="60" align="left"><a href="#" onClick="javascript:image_click(3);return false;"><img border="0" src="thumbnail.asp?file=[image3]&maxx=60&maxy=0" name="pimage3"></a> </td> <td width="5" align="center"></td> <!--END: image3--> <!--START: image4--> <td width="60" align="left"><a href="#" onClick="javascript:image_click(4);return false;"><img border="0" src="thumbnail.asp?file=[image4]&maxx=60&maxy=0" name="pimage4"></a> </td> <td width="5" align="center"></td> <td width="60" align="left"></td></tr> <!--END: image4--> Hi, I've been struggling with a formatting difference between IE & Firefox. I'd be really grateful if someone would be able to advise me what I'm doing wrong. URL : http://www.demoncraft.com/helpdesk/ticket.html Any help would be appreciated JON |