HTML - Site Good In Firefox But Not Ie
Hi everybody,
For some reason, my site sucks in IE but it's good in FireFox. When I view it in IE, the tables are all out of wack, and it doesn't look right, but it looks fine in firefox. The site is http://74.53.110.194/~redstar5/ thanks for your help, treadstar Similar TutorialsI have a webpage I put up and I have ie9 but I noticed under my daughters ie8 browser the fonts are all a diferant size. Checking the screen resolution on her laptop it is the same as on my comp so it must be the browser. I do not want to list the url to this page because I do not want the page listed in the search engines. So I attached as a txt file. Is there a fix for this? I know the header sucks under any screen res. but it is the fonts I am worried about. They are a differant size under ie8. Can anyone recommend a good tutorial site for learning HTML? I'm just starting out. Free is good, but I know you get what you pay for, so if the tutorials are good, I wouldn't mind paying for something of good quality. I don't want to get in over my head too soon and get discouraged. I'd really like to find some video tutorials. Thanks. Hi everybody, I am building a new website, and I have a browser compatibility issue. I'm using a table - and I'm looking to have a border, thin blue bar, text, thin blue bar, then border. My HTML displays fine in Firefox, but it looks like junk in IE (fat lines MUCH larger than 5 pixels!). Can you help me by telling me why? Thanks Jason ----------------------------------------------------- <table> <tr height=5px> <td> </td> <td style="background-color: blue;"> </td> <td>My Text</td> <td style="background-color: blue;"> </td> <td> </td> </tr> </table> The bottom section of this page looks good in IE but not in Firefox... anyone know why? Here's a screenshot of the Firefox page: http://www.massagelaunch.com/firefoxtableproblem.jpg and you can see the IE version he www.massagelaunch.com (scroll all the way to bottom) Howdy everyone! I'm a noob here and I'm at my wits end. The real problem here is that I know just enough to get myself into trouble, but no concept on how to dig myself out of it. The website I'm working on is he http://www.psychological-warfare.com My problem is that it looks OK in Explorer, but looks like a trainwreck in Firefox. It was designed by retrofitting a template I bought years ago, so it's like trying to decipher the amatuer translation of a Russian mad scientist's codex. I apologize in advance. I've been moving DIV's back and forth for days and Explorer doesn't seem to care. Things just keep getting worse and worse in Firefox. I think the main issue is that I have a left column and then the header that spans the middle and right columns. I can see how Firefox might hate that... The next problem (and I'm hoping someone might have an idea on this): I used a modern header calling this whole mess XHTML. I know exactly squat about the differences between HTML and XHTML except that XHTML loves to have everything "/>"ed. Would all of this work if the header called it transitional HTML and give myself a little leeway? What code should be at the top of my page? Thanks everyone for the help. I wish I could buy everyone a beer! Could anyone please help me? I created a login form. And when it is alone on a web page it displays properly in all browsers: IE , Opera and Firefox: http://www.gpftt.com/a/html/ But when I insert it into a html template it remains good in IE but becomes wrong in Opera and Firefox: http://www.gpftt.com/a/html/ind.html I have tried everything I could - html and css editing. I removed all styles from the web page but it still remains wrong. I spent a whole day over it and still couldn't get it working. Can anybody tell me wtf??? Hello, everybody! I have a problem. This page: http://friends21.com/index.php/publi.../name_joecool/ displays properly in Opera and Firefox, but wrong in IE. I mean in IE for some reason header and footer are aligned left, while in Opera and Firefox it stays centered as it must be. On this site users are allowed to use html code for their profiles (like for example myspace templates). So this user inserted some code that moves headers to the left. (compare with other users: http://friends21.com/index.php/publi...name_drewness/ http://friends21.com/index.php/publi...administrator/) But I couldn't find what exactly in that code moves header/footer to the left and why it does so only in IE but not in Opera and Firefox. Anybody knows? Your help is very much appreciated. Thank you all in advance. My website is: www.gstteam.co.nr My main problem is the Rosters. If I open the Rosters in IE7 it looks good but when I open it on Firefox it looks terrible, the images are all over the place and cant even see some of the text that I have under the images. I am using PageBreeze (Free Version). Can somebody please help me how I can fix the problem, I will greatly appreciate it. Thanks Why is it that this site looks good in most browsers but not Firefox? 'div id=search' and 'div id=mainnav' are not inline with the rest of the site (they are 10px to low). You could add HTML Code: div#search, div#mainnav { margin-top: -10px; } to a Firefox only CSS file or something. I don't think no-one else could do what I just (or a better job for that matter). I just thought I would tell you guys. My web site looks the way it's suppost to in IE, but not in FireFox. Could someone take a look with fresh eyes and let me know what needs to be fixed. I am using an external Style Sheet. Wrathchid Productions Code: /** Tempalte 20 **/ body { font-family: verdana, helvetica, arial, sans-serif; font-size: 10px; text-align: center; } html, body, #wrapper, h1, #nav, #nav li { margin: 0; padding: 0; list-style: none; } th, td { font-size: 10px; } img { border: 0; } #wrapper { margin: auto; text-align: left; width: 750px; position: relative; } h1, h2, h3 { font-size: 10px; } h1 { margin: 0; padding: 0; } h2 { margin: 0 0 0 0; padding: 0; } h3 { margin: 4px 0 0 0; padding: 0 0 0 0; } p { margin: 1em 0; padding: 0; } .block { display: block; } .clear { clear: both; height: 1px; padding-top: 0; margin-top: 0; margin-bottom: 0; font-size: 1px; line-height: 1px; } .left { float: left; margin: 1px 8px 0px 0px; } .right { float: right; margin: 1px 0px 0px 8px; } .softright { text-align: right; } .readmore { text-align: right; padding-right: 1em; } /* ***** */ body { background: #4A4A4A; color: #fff; padding-bottom: 30px; } a { color: #ADADAC; font-weight: bold; text-decoration: none; } a:hover { color: #fff; } .divider { clear: both; } .divider hr { display: none; } #wrapper { width: 684px; background: #5A5959 url(images/body_bg.gif) repeat-y; border-bottom: 1px solid #898888; } /* header */ #header { background: url(images/header_bg.jpg) repeat-x; position: relative; margin-right: 1px; height: 256px; } #header h1 { position: absolute; top: 24px; left: 0px; } #header a { color: #EADD13; } #header a:hover { color: #FFF; } #header #girl { position: absolute; top: 0px; left: 300px; width: px; background: url(images/header_cap.gif) top right no-repeat; } #header form { position: absolute; top: 224px; left: 10px; margin: 0; padding: 0; color: #B3B1B1; font-style: italic; } #header form .text { background: #7B7B7B; color: #FDFB30; width: 122px; border-top: 1px solid #1C1C1C; border-right: 1px solid #979797; border-bottom: 1px solid #B3B3B3; border-left: 1px solid #3F3F3F; } #header form .submit { background: #5A5959; color: #FDFB30; border: none; font-size: 9px; font-family: Verdana, Arial, Helvetica, sans-serif; font-weight: bold; padding: 3px; } * html #header form .submit { padding: 0 3px; padd\ing: 3px; } #header #signup { position: absolute; top: 218px; right: 0px; width: 20em; padding: 13px 20px 0 0; text-align: right; background: url(images/header_divider.gif) top right no-repeat; } /* nav */ #nav { position: absolute; top: 98px; left: 41px; width: 171px; height: 88px; } #nav li { background: url(images/arrow.gif) left center no-repeat; width: 183px; height: 16px; margin-bottom: 2px; padding-left: 18px; float: left; } * html #nav li { width: 210px; w\idth: 183px; } #nav a { display: block; width: 100%; padding-top: 2px; font-weight: normal; } #nav a:hover { color: #fff; } /* body */ #body { margin: 0px 10px 10px 10px; background: #313131 url(images/divider_v.gif) 417px 0px repeat-y; } #body h2 { font-weight: normal; color: #FDFB30; line-height: 21px; margin: 0 -4px 0 -4px; background: url(images/title_bg.gif) repeat-x; } #body h2 span { display: block; background: url(images/title_bullet.gif) top left no-repeat; } #body h2 span span { padding-left:41px; padding-bottom: 6px; background: url(images/title_cap.gif) top right no-repeat; } #body #left { float: left; width: 417px; } * html #body #left .left { margin-top: 12px; } #body #left .divider { margin: 0 6px 15px 6px; border-bottom: 1px solid #464646; height: 10px; } #body #right { float: right; width: 236px; } #body #right p { margin-top: 0.5em; } #body #right .divider { background: url(images/divider_h.gif) repeat-x; height: 9px; } #body .i { padding: 0px 15px 15px 15px; line-height: 1.3; } #body .j { padding: 0px 10px 5px 5px; } #body .k { padding: 0px 8px; } * html #right .readmore { margin-bottom: 0; } /* right */ #outside { margin-top: 6px; margin-left: 10px; position: relative; } ul.central li, ul.central { text-align: center; list-style: none; padding: 0 0 2px 0; margin: 0; } #right .k p { margin-bottom: 0.2em; } #right a { color: #F4CC0F; font-weight: normal; } #right a:hover { color: #fff; } /* footer */ #footer { margin-top: 15px; text-align: center; } #footer, #footer a { font-weight: normal; color: #F4CC0F; } #footer a { text-decoration: underline; } #footer a:hover { color: #fff; } Alright. Hpefully you all will be able to give me a helping hand. My site is located at http://www.eternalhogwarts.com If you have an older version of I.E look at it. It looks fine. However when you view it with Firefox and IE 7.0 it looks really strange and I really don't know what to do. Please help!!! Code: <html xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" xmlns="http://www.w3.org/TR/REC-html40"> <head> <style> <!-- /* Style Definitions */ div.MsoNormal {mso-style-parent:""; margin-right:0pt; text-indent:0pt; margin-top:0pt; margin-bottom:0pt; text-align:left; font-family:"Times New Roman"; font-size:10.0pt; color:black; } li.MsoNormal {mso-style-parent:""; margin-right:0pt; text-indent:0pt; margin-top:0pt; margin-bottom:0pt; text-align:left; font-family:"Times New Roman"; font-size:10.0pt; color:black; } p.MsoNormal {mso-style-parent:""; margin-right:0pt; text-indent:0pt; margin-top:0pt; margin-bottom:0pt; text-align:left; font-family:"Times New Roman"; font-size:10.0pt; color:black; } ol {margin-top:0in; margin-bottom:0in; margin-left:-2197in;} ul {margin-top:0in; margin-bottom:0in; margin-left:-2197in;} @page {mso-hyphenate:auto;} --></style> <meta http-equiv="Content-Language" content="en-us"> <meta http-equiv="Content-Type" content="text/html; charset=windows-1252"> <title>Announcements</title> </head> <body border="0" width="100%" height="912" link="#FFFFFF" vlink="#FFFFFF" alink="#FFFFFF" bgcolor="#0000FF"> <tr> <td colspan="3" height="184"> <table border="0" width="85%" cellpadding="0" height="665" cellspacing="0"> <tr> <td height="144" width="98%" colspan="3" align="center" bgcolor="#0000FF"> <img border="0" src="images/BannerGMSN.jpg" width="100%" height="144"></td> </tr> <tr> <td height="36" colspan="3" align="center" bordercolor="#FFFFFF"> <p align="center"> <font face="arial" color="#FFFFFF" size="4"> <b><a href="index.htm" style="text-decoration: none">Home</a> <a href="Announcements.htm" style="text-decoration: none"> Announcements</a> <a href="Athletics&Activities.htm" style="text-decoration: none"> Athletics & Activities</a> <a href="GMSN_Information.htm" style="text-decoration: none"> GMSN Information</a> <a href="https://www.geneva304.org/departments/curriculum_instruction/frameworksformiddleschool.asp" style="text-decoration: none"> Curriculum</a></b> </font></td> </tr> <tr> <td width="16%" bgcolor="#FFFFFF" align="left" bordercolor="#FFFFFF" valign="top"> <!--[if pub]><xml> <b:ColorScheme type="OplSccm" oty="92" oh="279"> <b:Rgecp type="OplEcp" priv="214"> <b:OplEcp type="OplEcp" priv="411"> </b:OplEcp></b:Rgecp></b:ColorScheme><![if pub11]><xml> <b:Page type="OplPd" oty="67" oh="265"> <b:PtlvOrigin type="OplPt" priv="511"> <b:Xl>22860000</b:Xl> <b:Yl>22860000</b:Yl> </b:PtlvOrigin> <b:Oid priv="605">(`@`````````</b:Oid> <b:OhoplWebPageProps priv="90E">266</b:OhoplWebPageProps> <b:OhpdMaster priv="D0D">263</b:OhpdMaster> <b:PgtType priv="1004">5</b:PgtType> <b:PtlvOriginEx type="OplPt" priv="1111"> <b:Xl>110185200</b:Xl> <b:Yl>110185200</b:Yl> </b:PtlvOriginEx> </b:Page> </xml><style><!-- /* Style Definitions */ div.MsoNormal {mso-style-parent:""; margin-right:0pt; text-indent:0pt; margin-top:0pt; margin-bottom:0pt; text-align:left; font-family:"Times New Roman"; font-size:10.0pt; color:black; } li.MsoNormal {mso-style-parent:""; margin-right:0pt; text-indent:0pt; margin-top:0pt; margin-bottom:0pt; text-align:left; font-family:"Times New Roman"; font-size:10.0pt; color:black; } p.MsoNormal {mso-style-parent:""; margin-right:0pt; text-indent:0pt; margin-top:0pt; margin-bottom:0pt; text-align:left; font-family:"Times New Roman"; font-size:10.0pt; color:black; } ol {margin-top:0in; margin-bottom:0in; margin-left:-2197in;} ul {margin-top:0in; margin-bottom:0in; margin-left:-2197in;} @page {mso-hyphenate:auto;} --></style> <![if pub11]><img border="0" src="images/viking.jpg" width="116" height="142"><br> <font color="#FFFFFF" face="Arial"> <span style="font-weight: 700; background-color: #FFFFFF"> </span> </font><br> </td> <td width="56%" bgcolor="#FFFFFF" align="left" bordercolor="#FFFFFF" rowspan="2" valign="top"> <p style="margin-top: 0; margin-bottom: 0"><br> <span style="font-weight: 700"> <font face="Arial" color="#0000FF" size="6">Announcements</font></span></td> <td width="28%" bgcolor="#FFFFFF" align="center" bordercolor="#FFFFFF" rowspan="2" valign="top"> <p> </td> </tr> <tr> <td width="16%" bgcolor="#FFFFFF" align="left" bordercolor="#FFFFFF" valign="top" height="348"> <div style="position: absolute; top: 591px; left: 41px; width: 104px; height: 101px; z-index: 1"> <p style="line-height: 150%; margin-top: 6px; margin-bottom: 6px"> <a href="http://www.geneva304.org/"> <img border="0" src="images/Announ1.jpg" width="104" height="101"></a></div> </td> </tr> </table> </body> </html> Hi friends, I have just "finished" creating http://www.ambertower.co.uk which seems to be up and running just fine in internet explorer. However, when I test the site in firefox it is all going very wrong. Can someone please have a look at the site's HTML for me and let me know where I am going wrong. Thanks very much for your help!! I don't understand why this is rendering differently. It looks perfect in Firefox but when I switch to IE it is all screwed up. http://www.rosamondgroup.com XHTML: Quote: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"></meta> <title>Rosamond Appraisal Group </title> <link href="style.css" rel="stylesheet" type="text/css"></link> </head> <body> <div id="logo"> <span class="style1"> <img src="images/raplogo.png" alt=""></img> </span> </div> <div id="complete"> <div id="main"> <div id="header"> <span class="style1"> About Us</span> </div> <div> <img src="images/content-box_04-215.jpg" alt=""></img> </div> <div id="content"> Jimmy Rosamond<br/> Louisiana State Certified General<br/> Real Estate Appraiser #G0655<br/> JimmyR@RosamondGroup.com</div> <div> <img src="images/content-box_07-215.jpg" alt=""></img> </div> </div> <div id="main2"> <div id="header2"> <span class="style1"> Contact Information</span> </div> <div> <img src="images/content-box_04.jpg" alt=""></img> </div> <div id="content2"> 434 Glendale Drive<br/> Metairie, La 70001<br/> (504) 831-7903<br/> (504) 831-8938 (FAX) </div> <div> <img src="images/content-box_07.jpg" alt=""></img></div> </div> </div> <div id="valid"> <a href="http://validator.w3.org/check?uri=referer"><img class="img" src="images/valid-xhtml10.png" alt="" /></a> <a href="http://jigsaw.w3.org/css-validator/check/referer"> <img class="img" src="images/vcss.png" alt="" /></a> </div> </body> </html> CSS: Quote: /* CSS Document */ #logo { margin-left:10%; margin-right:10%; margin-top:10%; text-align:center; } #complete { margin-top:5%; margin-left:10%; margin-right:10%; } #main { width:215px; border:1px solid #000000; float:left; margin-left:20%; } #header { width:215px; height:22px; background-image:url(images/content-box_02.jpg); background-repeat:repeat-x; } #content { height:80px; background-image:url(images/content-box_05-215.jpg); background-repeat:repeat-y; font-size:11px; } .style1 { font-family:"Century Gothic"; font-size:12px; color:#FFFFFF; background-color:inherit; } #main2 { width:200px; border:1px solid #000000; float:right; margin-right:20%; } #header2 { width:200px; height:22px; background-image:url(images/content-box_02.jpg); background-repeat:repeat-x; } #content2 { height:80px; background-image:url(images/content-box_05.jpg); background-repeat:repeat-y; font-size:11px; } #valid { position:absolute; left:80%; top:92%; } .img { border:0px; } I've also included screenshots of both renders. Firefox: http://flickr.com/photos/boryenka/2559461808/ IE: http://flickr.com/photos/boryenka/2558636987/ I've just used adobe browser lab to look at my website in windows browsers and it looks awful and I have no idea why. All my floats seem to have collapsed. Can anyone point me as to what I may have done wrong? Here is my website Google chrome, IE 7 and 8, and i think Opera all load the images fine. but Firefox (latest version) just does not load all of them. I refresh the page and it loads the ones that did not load before but still has some unloaded. Can some one please explain to me or help me on this? i have been pulling my hair out Thanks for help people, photos should be below. The first one is the Firefox one. Also here is a link to the page: http://www.dubbest.com/index%20MAIN.htm http://www.ptacnik.com/index102.html When previewing through Dreamweaver in ANY of these 3 browsers it looks fine. (from my local drive) But once online it only loads in Firefox. Is there something fishy with the frames perhaps? missing an XML doc on my end? I can't figure out what is causing this. Any help would be very much appreciated. http://www.ptacnik.com/nav1.html is the top frame and the list below are the frames loaded under nav1. http://ptacnik.com/about101.html http://ptacnik.com/design.html http://ptacnik.com/illustration.html Hi, I ran a code validation on my site (www.improvizations.com), it came back with 11 errors. Many of them look like this: Line 9, Column 31: there is no attribute "leftmargin". <body topmargin="0" leftmargin="0" marginwidth="0" rightmargin ="0" marginheight and this: Line 15, Column 43: required attribute "alt" not specified. <div id="logo"><img src="images\logo.gif" /></div> How do I fix this? Also, my site looks fine in IE but awful in Firefox. What's going on? Any help would be greatly appriciated. I'm a newbie with all of this. Thanks!! http://www.immc.ca/index.php?option=...d=24&Itemid=47 When you scroll over the drop down menu items, they appear behind the canada map flash piece. On other pages of the site, the menu appears correctly, in front of the site content. This is only happening in Firefox. Hello, for one site only, IE6 fails to prompt to save password for a Login Form. This is a new site. IE6 *does* prompt for other sites (e.g. amazon.com sign-on) The IE autocomplete settings are set to prompt in the usual way. I've tried clearing all cookies/cache etc. There are no autocomplete disabled/off settings in the page. What is strange is that Firefox does prompt to save password for site for the problematic page, as I would expect IE to. The only thing that's maybe a bit unusual is that the INPUT name="..." in the Form contains unusual chars such as ^ and !. But i wouldnt have though that was a problem (?). Any ideas why the save password prompt is not appearing for this one site? thanks. |