HTML Works in IE Not Chrome or FireFox Why?

N

Nooner Lenovo

Hello,

In the below HTML table it works fine in IE but
when I looked at it in Chrome or FireFox it has
double backgroungs in my table and is too big
(which I think is why there is doubling of the
background images). I use real text with a shadow
background image (so google can read it) to give
the text a nice look, and use the background to put
some flurishes and other images. So why the
differences?

<table border=3 cellspacing="0" cellpadding="0" width=875
bgcolor=#202020>
<tr><td colspan="3" align="center"
background="TextBG3.jpg"><br><center>
<H1>TiTle</H1></td></tr>
<tr><td
background="TextBG4.jpg">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</
td><td background="TextBG1.jpg"><br><h2><center>Blah Blah Blah</h2></
td><td
background="TextBG4.jpg">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</
td></tr><tr><td
background="TextBG5.jpg">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</
td><td background="TextBG2.jpg"><h3><center><br>Blah Blah Blah</h3><td
background="TextBG5.jpg">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</
td>
</td></tr> </center>
</table>

The &nbsp; are to line everything up right, to this day I still have
so much problems with tables.

Thanks for any help
 
R

richard

Hello,

In the below HTML table it works fine in IE but
when I looked at it in Chrome or FireFox it has
double backgroungs in my table and is too big
(which I think is why there is doubling of the
background images). I use real text with a shadow
background image (so google can read it) to give
the text a nice look, and use the background to put
some flurishes and other images. So why the
differences?

<table border=3 cellspacing="0" cellpadding="0" width=875
bgcolor=#202020>
<tr><td colspan="3" align="center"
background="TextBG3.jpg"><br><center>
<H1>TiTle</H1></td></tr>
<tr><td
background="TextBG4.jpg">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</
td><td background="TextBG1.jpg"><br><h2><center>Blah Blah Blah</h2></
td><td
background="TextBG4.jpg">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</
td></tr><tr><td
background="TextBG5.jpg">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</
td><td background="TextBG2.jpg"><h3><center><br>Blah Blah Blah</h3><td
background="TextBG5.jpg">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</
td>
</td></tr> </center>
</table>

The &nbsp; are to line everything up right, to this day I still have
so much problems with tables.

Thanks for any help

mostly because you're trying to incorporate things that are not permitted
in <td> tags.
You need to apply css and then it will work as intended.
For your table title use <th> instead of the H1.

In the head section:
<style type=text/css">

td {background:(url) textBGS.jpg;}


</style>

as an example to show you what you need to do next.
If you'd like, gi9ve each td cell a class name then style the class name.

Or you can use inline style:

<td style="backgorund:(url) textBGS.jpg;">

But please learn to use css. It will make coding easier and cleaner.
 
E

Edward A. Falk

Hello,

In the below HTML table it works fine in IE but
when I looked at it in Chrome or FireFox it has
double backgroungs in my table and is too big
(which I think is why there is doubling of the
background images). I use real text with a shadow
background image (so google can read it) to give
the text a nice look, and use the background to put
some flurishes and other images. So why the
differences?

Your table is mal-formatted.

I've taken the liberty to remove the nbsp entries and
properties and pretty-print so you can see the structure:

<table>
<tr>
<td colspan="3" align="center">
1 <br><center>
<H1>TiTle</H1>
</td>
</tr>
<tr>
<td> </td>
<td><br><h2><center>Blah Blah Blah</h2></td>
<td> </td>
</tr>
<tr>
<td> </td>
2 <td><h3><center><br>Blah Blah Blah</h3>
<td> </td>
3 </td>
</tr>
4 </center>
</table>

1: unterminated <center> tag.
was that tag even needed, since you set align=center?

2 unterminated <td> tag
3 extraneous </td>
4 extraneous </center>

Also, are you allowed to use <h1>, etc. in a <td>? Not sure.

But because of errors 1-4, it's catch-as-catch-can what the browser will
do with it.

Other than that, other posters are right; you should be using CSS.
 
J

Jonathan N. Little

Edward said:
Also, are you allowed to use <h1>, etc. in a <td>? Not sure.

Yes you are. But since the OP had peppered the markup
with &nbsp; in a failed attempt to "style" the page, (akin to
space-old-typewriter-technique with word processors), the OP need some
basics in HTML first.

Try tutorials on www.htmldog.com
 
H

Hot-Text

Nooner Lenovo said:
Hello,

In the below HTML table it works fine in IE but
when I looked at it in Chrome or FireFox it has
double backgroungs in my table and is too big
(which I think is why there is doubling of the
background images). I use real text with a shadow
background image (so google can read it) to give
the text a nice look, and use the background to put
some flurishes and other images. So why the
differences?

<table border=3 cellspacing="0" cellpadding="0" width=875
bgcolor=#202020>
<tr><td colspan="3" align="center"
background="TextBG3.jpg"><br><center>
<H1>TiTle</H1></td></tr>
<tr><td
background="TextBG4.jpg">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</
td><td background="TextBG1.jpg"><br><h2><center>Blah Blah Blah</h2></
td><td
background="TextBG4.jpg">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</
td></tr><tr><td
background="TextBG5.jpg">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</
td><td background="TextBG2.jpg"><h3><center><br>Blah Blah Blah</h3><td
background="TextBG5.jpg">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</
td>
</td></tr> </center>
</table>

The &nbsp; are to line everything up right, to this day I still have
so much problems with tables.

Thanks for any help

it the Editor you are using is the problems..

< http://software.visicommedia.com/en/products/acehtmlfreeware/ >

AceHTML Freeware HTML editor beats every other paid-for HTML editor hands down.
 
D

Denis McMahon

In the below HTML table it works fine in IE but when I looked at it in
Chrome or FireFox it has double backgroungs in my table and is too big
(which I think is why there is doubling of the background images). I
use real text with a shadow background image (so google can read it) to
give the text a nice look, and use the background to put some flurishes
and other images. So why the differences?

I threw a basic document round your code (<html><head><title>test</
title></head><body> and </body></html>) and ran it through tidy, the
following output may help:

line 4 column 30 - Warning: missing </center>
line 8 column 41 - Warning: <center> isn't allowed in <h2> elements
line 8 column 37 - Info: <h2> previously mentioned
line 13 column 37 - Warning: <center> isn't allowed in <h3> elements
line 13 column 33 - Info: <h3> previously mentioned
line 16 column 12 - Warning: discarding unexpected </center>
line 2 column 1 - Warning: <table> lacks "summary" attribute
line 3 column 5 - Warning: <td> proprietary attribute "background"
line 6 column 5 - Warning: <td> proprietary attribute "background"
line 8 column 4 - Warning: <td> proprietary attribute "background"
line 9 column 4 - Warning: <td> proprietary attribute "background"
line 11 column 13 - Warning: <td> proprietary attribute "background"
line 13 column 4 - Warning: <td> proprietary attribute "background"
line 13 column 68 - Warning: <td> proprietary attribute "background"

Have you thought about using css for centering and background images?

Inspecting your code manually, I can see the following obvious faults:

1) Looking at the td in the first row, There should be a closing </center>
after the closing </h1> and before the closing </td>. One of the most
fundamental rules of html is that for elements that require a closing
tag, when such elements are opened inside a containing element, they must
be closed inside that containing element. Thus if you open a center
element within a td element, you must close the center element before you
close the td element (after closing any element opened inside the center
element).

2) In the second table row, the second table cell contains an h3 element
that contains the opening tag of a center element, but no closing tag.
Firstly the center tag should be outside the h3 element, and secondly the
center tag needs to be closed.

3) In the third table row:

3a) The center tag in the second cell should be outside the <h3>, not
contained inside it, and should have a matching </center> (see points 1 &
2) after the </h3> and before the </td>

3b) The third table cell is inside the second table cell, I don't think a
table cell is allowed to nest like that unless you create a whole table
inside the enclosing cell.

4) wtf is a </center> doing between the last </tr> and the </table>.
Wherever it is meant to be, that isn't where it goes.

Rgds

Denis McMahon
 

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments. After that, you can post your question and our members will help you out.

Ask a Question

Members online

Forum statistics

Threads
473,764
Messages
2,569,566
Members
45,041
Latest member
RomeoFarnh

Latest Threads

Top