HTML - Firefox vs. IE

snoochface · Jun 16, 2006

I posted this elsewhere but thought I might get a little help from this forum.

I'm used to HTML working in IE but not in Firefox, but this is a reverse situation.

My CF Homepage Custom HTML includes borders around a center table, sort of like a picture frame. I use vertical borders on the left and right sides (table backgrounds), and a horizontal border across the top and bottom in tables that use a COLSPAN tag.

The borders display perfectly in Firefox, but when I view the page in IE, only the left and right side borders display. The top and bottom borders do not. The only thing I can think of is the COLSPAN tag - is it not recognized in IE like it is in Firefox?

If anyone has suggestions for fixing the problem, I'd really appreciate it. Thanks!

eonasdan · Jun 16, 2006

If you have dreamweaver, use it to see what IE doesn't like about your source code. If you don't have it, I could take alook. Anyway, if you want to leave it for FF users, you can setup up the following:
1) Get a browser detection script from javascript.internet.com (no sure where it is, haven't looked for it in awhile)
2) If your good with javascript, look at what the vars when it finds out what browser it is.
3) Using if (~name of var here~==~what it assigns a IE broswer to~) { document.write("stuff goes here") } else { document.write("other stuff goes here") }

becareful with this as javascript is very picky. If you miss a comman it won't work. If you need help let me know.

PS. *bumps* you use FF w00t :clap:

snoochface · Jun 16, 2006

Thanks for the tip, but I don't think Erwin allows Javascript on the Custom page. I have to stick with straight HTML. Unfortunately I don't have Dreamweaver anymore.

It's just weird, I'm not used to something working in Firefox that doesn't work in IE. It's usually the other way around.

rdale · Jun 16, 2006

Did you forgot to close a row tag...? </TR>

Can you paste the source into a code block like:

Code:

code goes here...

snoochface · Jun 16, 2006

rdale04 said:
Did you forgot to close a row tag...? </TR>

Can you paste the source into a code block like:

Code:

code goes here...

I had no idea there was a code tag. Cool beans.

Edit: Didn't paste the CSS into the code below the first time...

Code:

<head><style type="text/css">
<!--

.itemTitle{
font-family: Comic Sans MS;
font-size: 1.4em;
font-weight:bold;
}

.tableBackground{
background: url(http://x4f.xanga.com/3d4e041b1473360234955/w724893.jpg)}


P {font-family:Comic Sans MS; font-size: 14pt; font-weight:bold}
TD {font-family:Comic Sans MS; font-size: 14pt; font-weight:bold}
TH {font-family:Comic Sans MS; font-size: 14pt; font-weight:bold}
A:link    {color:#0033CC; text-decoration:none;}
A:visited {color:#6600CC; text-decoration:none;}
A:active  {color:#99CC33; text-decoration:none;}
A:hover {color:#6600CC; text-decoration:overline; background:#}
Body {background: url(http://i.xanga.com/snoochface/pawprint.jpg) no-repeat}

//-->
</style>


<TABLE BORDER="0" CELLPADDING="10" CELLSPACING="0" width="100%">

<TR>
<!-- Top Border -->
<td align="center" colspan="3" class="tableBackground"></td>
</TR>
</table>    

<table border="1" cellspacing="0" cellpadding="10" width="100%">
<tr>

<!-- Left Column -->
<td align="center" colspan="1" class="tableBackground"></td>

<!-- Center Column -->
<td align="center" colspan="1"><FONT COLOR="#000000" size=+1>

<p align=center>     <FONT COLOR="#000000" size=+2>

Content Goes Here

</td>

<!-- Right Column -->

<td align="center" colspan="1" class="tableBackground"></td></tr>

<!-- Bottom Border -->
<td align="center" colspan="3" class="tableBackground"></td>

</table>

Les Grands Pieds · Jun 16, 2006

IE is crappy, it doesn't follow the rules of HTML correctly like all the other browsers.

wiggsfly · Jun 17, 2006

Just an added point, try it in IE7 as well as 6. You will almost surely get different results.

rdale · Jun 17, 2006

Could not paste it all in... got a "The text that you have entered is too long (19245 characters). Please shorten it to 15000 characters long." warning.

OK, viewed source with UltraEdit32 at http://www.ultraedit.com, ran ---> Format | HTML Validation | Run HTML Tidy --- which offered the following:

Code:

HTML Tidy Parsing ...
line 866 column 63 - Warning: <img> element not empty or not closed
line 867 column 64 - Warning: <img> element not empty or not closed
line 868 column 63 - Warning: <img> element not empty or not closed
line 869 column 64 - Warning: <img> element not empty or not closed
line 870 column 63 - Warning: <img> element not empty or not closed
line 871 column 88 - Warning: <img> element not empty or not closed
line 872 column 88 - Warning: <img> element not empty or not closed
line 874 column 88 - Warning: <img> element not empty or not closed
line 875 column 88 - Warning: <img> element not empty or not closed
line 877 column 88 - Warning: <img> element not empty or not closed
line 878 column 88 - Warning: <img> element not empty or not closed
line 879 column 88 - Warning: <img> element not empty or not closed
line 880 column 86 - Warning: <img> element not empty or not closed
line 908 column 1 - Warning: missing <tr>
line 913 column 135 - Warning: unescaped & or unknown entity "&to"
line 913 column 149 - Warning: unescaped & or unknown entity "&close"
line 913 column 218 - Warning: <img> element not empty or not closed
line 894 column 7 - Warning: missing </fieldset>
line 922 column 7 - Warning: discarding unexpected </fieldset>
line 923 column 3 - Warning: discarding unexpected </td>
line 924 column 1 - Warning: discarding unexpected </tr>
line 977 column 66 - Warning: <phrase> attribute name "1" (value="snoochface") is invalid
line 977 column 66 - Error: <phrase> is not recognized!
line 977 column 66 - Warning: discarding unexpected <phrase>
line 988 column 5 - Warning: discarding unexpected </div>
line 989 column 3 - Warning: discarding unexpected </td>
line 990 column 1 - Warning: discarding unexpected </tr>
line 999 column 7 - Warning: <input> element not empty or not closed
line 1000 column 7 - Warning: <input> element not empty or not closed
line 1001 column 7 - Warning: <input> element not empty or not closed
line 1031 column 1 - Warning: missing </div> before <li>
line 1032 column 1 - Warning: inserting implicit <ul>
line 1032 column 1 - Warning: missing </ul> before </div>
line 1067 column 9 - Warning: <img> element not empty or not closed
line 1068 column 9 - Warning: <img> element not empty or not closed
line 1069 column 9 - Warning: <img> element not empty or not closed
line 1070 column 9 - Warning: <img> element not empty or not closed
line 1077 column 9 - Warning: <img> element not empty or not closed
line 1078 column 77 - Warning: <img> element not empty or not closed
line 1115 column 1 - Warning: <img> element not empty or not closed
line 1115 column 104 - Warning: <img> element not empty or not closed
line 1115 column 210 - Warning: <img> element not empty or not closed
line 1115 column 301 - Warning: <img> element not empty or not closed
line 1115 column 397 - Warning: <img> element not empty or not closed
line 1115 column 499 - Warning: <img> element not empty or not closed
line 1123 column 1 - Warning: <img> element not empty or not closed
line 1123 column 105 - Warning: <img> element not empty or not closed
line 1123 column 191 - Warning: <img> element not empty or not closed
line 1123 column 294 - Warning: <img> element not empty or not closed
line 1136 column 1614 - Warning: missing <td>
line 1185 column 1 - Warning: <embed> is not approved by W3C
line 1207 column 1 - Warning: <embed> is not approved by W3C
line 1221 column 124 - Warning: unescaped & or unknown entity "&u"
line 1228 column 1 - Warning: missing </a> before <a>
line 1228 column 214 - Warning: discarding unexpected </a>
line 1300 column 1 - Warning: discarding unexpected <head>
line 1298 column 7 - Warning: <style> isn't allowed in <fieldset> elements
line 1298 column 7 - Warning: <title> isn't allowed in <fieldset> elements
line 1356 column 32 - Warning: missing </font> before <p>
line 1363 column 17 - Warning: inserting implicit <font>
line 1365 column 1 - Warning: <img> element not empty or not closed
line 1365 column 65 - Warning: <br> element not empty or not closed
line 1363 column 17 - Warning: missing </font> before <hr>
line 1368 column 13 - Warning: <hr> element not empty or not closed
line 1369 column 1 - Warning: inserting implicit <font>
line 1369 column 1 - Warning: replacing </p> by <br>
line 1384 column 1 - Warning: <br> element not empty or not closed
line 1384 column 5 - Warning: <img> element not empty or not closed
line 1384 column 57 - Warning: <br> element not empty or not closed
line 1369 column 1 - Warning: missing </font> before <p>
line 1385 column 1 - Warning: inserting implicit <font>
line 1386 column 110 - Warning: <br> element not empty or not closed
line 1386 column 156 - Warning: <br> element not empty or not closed
line 1386 column 160 - Warning: <br> element not empty or not closed
line 1385 column 6 - Warning: missing </font> before <hr>
line 1385 column 1 - Warning: missing </font> before <hr>
line 1387 column 1 - Warning: <hr> element not empty or not closed
line 1391 column 1 - Warning: inserting implicit <font>
line 1391 column 1 - Warning: inserting implicit <font>
line 1392 column 23 - Warning: <br> element not empty or not closed
line 1392 column 27 - Warning: <br> element not empty or not closed
line 1393 column 111 - Warning: unescaped & or unknown entity "&trooper"
line 1393 column 122 - Warning: unescaped & or unknown entity "&type"
line 1393 column 52 - Warning: <img> element not empty or not closed
line 1394 column 1 - Warning: <br> element not empty or not closed
line 1394 column 5 - Warning: <br> element not empty or not closed
line 1391 column 6 - Warning: missing </font> before <hr>
line 1391 column 1 - Warning: missing </font> before <hr>
line 1391 column 1 - Warning: missing </font> before <hr>
line 1394 column 9 - Warning: <hr> element not empty or not closed
line 1398 column 1 - Warning: inserting implicit <font>
line 1398 column 1 - Warning: inserting implicit <font>
line 1398 column 1 - Warning: inserting implicit <font>
line 1398 column 61 - Warning: <br> element not empty or not closed
line 1399 column 1 - Warning: <img> element not empty or not closed
line 1400 column 1 - Warning: <br> element not empty or not closed
line 1400 column 6 - Warning: <br> element not empty or not closed
line 1398 column 1 - Warning: missing </font> before <hr>
line 1398 column 1 - Warning: missing </font> before <hr>
line 1398 column 1 - Warning: missing </font> before <hr>
line 1400 column 10 - Warning: <hr> element not empty or not closed
line 1403 column 1 - Warning: inserting implicit <font>
line 1403 column 1 - Warning: inserting implicit <font>
line 1403 column 1 - Warning: inserting implicit <font>
line 1403 column 1 - Warning: missing </font> before <p>
line 1403 column 1 - Warning: missing </font> before <p>
line 1403 column 1 - Warning: missing </font> before <p>
line 1404 column 1 - Warning: inserting implicit <font>
line 1404 column 1 - Warning: inserting implicit <font>
line 1404 column 1 - Warning: inserting implicit <font>
line 1406 column 50 - Warning: <img> element not empty or not closed
line 1406 column 114 - Warning: <br> element not empty or not closed
line 1406 column 196 - Warning: <br> element not empty or not closed
line 1406 column 200 - Warning: <br> element not empty or not closed
line 1405 column 6 - Warning: missing </font> before <hr>
line 1404 column 1 - Warning: missing </font> before <hr>
line 1404 column 1 - Warning: missing </font> before <hr>
line 1404 column 1 - Warning: missing </font> before <hr>
line 1406 column 204 - Warning: <hr> element not empty or not closed
line 1410 column 1 - Warning: inserting implicit <font>
line 1410 column 1 - Warning: inserting implicit <font>
line 1410 column 1 - Warning: inserting implicit <font>
line 1410 column 1 - Warning: inserting implicit <font>
line 1411 column 73 - Warning: unescaped & or unknown entity "&friendID"
line 1412 column 1 - Warning: <img> element not empty or not closed
line 1412 column 76 - Warning: <br> element not empty or not closed

Info: Doctype given is "-//W3C//DTD XHTML 1.0 Transitional//EN"
Info: Document content looks like HTML Proprietary
288 warnings, 1 error were found!
This document has errors that must be fixed before
using HTML Tidy to generate a tidied up version.

You can also open the page with Opera, then right-click somewhere, then select "Validate". Opera yielded:

Code:

Result:	Failed validation, 863 errors 	
File:	t3087394-html-firefox-vs-ie.html	
Encoding:	iso-8859-1	
Doctype:	XHTML 1.0 Transitional

You need to close some tags to get going. If you don't have Opera, get it and validate the page like I said, or, maybe you can w/Firefox?.

rdale · Jun 17, 2006

Sorry, it's been a long day...

Not sure if it's the CF Homepage markup or yours, never tried using it. Anyway, you can paste the addy of your home page here to check it with what ever browser you want:

W3C Markup Validation Service
http://validator.w3.org/

snoochface · Jun 17, 2006

I will try that and look at the code again for missing closed tags. If it works, thanks!

If it doesn't, I'll post again.

snoochface · Jun 17, 2006

rdale04 said:
Sorry, it's been a long day...

Not sure if it's the CF Homepage markup or yours, never tried using it. Anyway, you can paste the addy of your home page here to check it with what ever browser you want:

W3C Markup Validation Service
http://validator.w3.org/

Okay, that seems to be wanting to validate XML or a DTD. Unless I just don't know how to use the tool properly, it's not validating HTML. Like, it thinks I need to close an <hr> tag and doesn't recognize table elements.

I'll look over the code manually and see if I'm missing any closing </tr> tags.

I am using the newest IE to view the page, if that matters.

Thanks!

snoochface · Jun 17, 2006

Okay I went back over my code. I did find a missing </tr> which I added, but it didn't fix the problem.

Here is what the bottom border looks like in Firefox - it works properly and shows the left/right border as well as the bottom border:

Here is what the bottom border looks like in IE - it's not there, only the left/right border shows up:

So, I'm stumped.

kopilo · Jun 17, 2006

I suggest you go to this page and look through the links on which CSS tags are supported by which browser.

I hope you find this helpful.

snoochface · Jun 17, 2006

kopilo said:
I suggest you go to this page and look through the links on which CSS tags are supported by which browser.

I hope you find this helpful.

Thanks, but according to that site, the version of IE I am using (6.x) should work just fine with my code.

It's not CSS that is affecting the tables. IE utilizes the CLASS tag for the side borders just fine, but does not implement them for the top and bottom borders. If it were a CSS issue, it wouldn't work on the side borders either. I think there is either an issue with the COLSPAN tag in IE, or a bug within CF, or some other problem I'm not recognizing.

kopilo · Jun 18, 2006

Hmm this is strange, is the valign set correctly as well?

eonasdan · Jun 18, 2006

The code you posted before only came back with two errors according to Dreamweaver 8 and those were both for FF. However, on reviewing the entire code of your home page it came back with 37 errrors. Granted this maybe browser errors that are at the fault of Christian Forums not your coding. Dreamweaver generated an XML file that shows all of the browser errors. Unfortunately all the shows is the document tree so you will have to thumb thru it. You can find the xml report at http://williamstonsc.us/ResultsReport.xml

snoochface · Jun 18, 2006

eonasdan said:
The code you posted before only came back with two errors according to Dreamweaver 8 and those were both for FF. However, on reviewing the entire code of your home page it came back with 37 errrors. Granted this maybe browser errors that are at the fault of Christian Forums not your coding. Dreamweaver generated an XML file that shows all of the browser errors. Unfortunately all the shows is the document tree so you will have to thumb thru it. You can find the xml report at http://williamstonsc.us/ResultsReport.xml

Thanks for that. I don't see any errors that would relate to IE not displaying those tables properly.

I'm not finding anything on the internet to indicate that IE does funky things with a COLSPAN tag either.

Unless anyone else has any ideas, I'm leaning toward thinking this might be a CF bug.

HTML - Firefox vs. IE

Meet the new boss -- same as the old boss.

Active Member

Meet the new boss -- same as the old boss.

Well-Known Member

Meet the new boss -- same as the old boss.

Regular Member

Walking the tightrope of life

Well-Known Member

Well-Known Member

Meet the new boss -- same as the old boss.

Meet the new boss -- same as the old boss.

Meet the new boss -- same as the old boss.

Attachments

Envisioner

Meet the new boss -- same as the old boss.

Envisioner

Active Member

Meet the new boss -- same as the old boss.

Similar threads