Line above text field in IE

[Clayburn]

I have a form with a text field. I added it to a website already
designed by a previous company. Eventually I'll redesign the entire
site, but for now I need to get this to work. However, in IE, there
is a line before the text field and as a result, the tables get messed
up, creating a bunch of extra space between tables. You can see the
difference in Firefox and IE. It works fine in Firefox.

Can someone tell me how best to fix this in IE?

 

[Clayburn]

I have a form with a text field.  I added it to a website already
designed by a previous company.  Eventually I'll redesign the entire
site, but for now I need to get this to work.  However, in IE, there
is a line before the text field and as a result, the tables get messed
up, creating a bunch of extra space between tables.  You can see the
difference in Firefox and IE.  It works fine in Firefox.

Can someone tell me how best to fix this in IE?

Sorry, I forgot to put the URL. It's http://www.gelbcenter.com

 

[richard]

Sorry, I forgot to put the URL. It's http://www.gelbcenter.com

Why are you insisting on using tables for this?
Two simple divisions would be better.
Then I would suggest a navigation bar across the top instead of that
outdated, ignorant enter button.

 

[Clayburn]

Why are you insisting on using tables for this?
Two simple divisions would be better.
Then I would suggest a navigation bar across the top instead of that
outdated, ignorant enter button.

I didn't design it. It was designed before I got here. I need to
tweak it some to add a few features and keyword optimization and
whatnot. The form on the front page is one feature I need to add.
But it disrupts the current design in IE. I'm going to be redesigning
it, but in the meantime I need to make some changes to the current
site, so I have to work with what's there. I don't want to redo it
entirely just to add the form since I'll be trashing the current
design once the new one is up and running anyway.

I just need a fix to keep it from screwing up in IE. It works fine in
Firefox.

 

[richard]

I didn't design it. It was designed before I got here. I need to
tweak it some to add a few features and keyword optimization and
whatnot. The form on the front page is one feature I need to add.
But it disrupts the current design in IE. I'm going to be redesigning
it, but in the meantime I need to make some changes to the current
site, so I have to work with what's there. I don't want to redo it
entirely just to add the form since I'll be trashing the current
design once the new one is up and running anyway.

I just need a fix to keep it from screwing up in IE. It works fine in
Firefox.

Sure it looks fine until you increase the text size.
Use divisions and set the CSS in em's.
Then the division will change height with the text size increase.

 

[Clayburn]

Sure it looks fine until you increase the text size.
Use divisions and set the CSS in em's.
Then the division will change height with the text size increase.

What should I do about IE? How can I get rid of the extra space?
They sliced an image for the table background, so it's important that
they line up correctly.

 

[richard]

Sorry, I forgot to put the URL. It's http://www.gelbcenter.com

I just realized that the line might be coming from the fact the "form"
is not inside the area it's supposed to be in. If you could move that
up a line or two, that should help.

 

[Clayburn]

I just realized that the line might be coming from the fact the "form"
is not inside the area it's supposed to be in. If you could move that
up a line or two, that should help.

The problem is the <form method="post" action="../php/formmail2.php">
If I remove it, it's fine. But I need that for the form to work. So
where should I put it?

 

[Clayburn]

I just realized that the line might be coming from the fact the "form"
is not inside the area it's supposed to be in. If you could move that
up a line or two, that should help.

Okay, I think I got it. The problem is for some reason the </form>
creates an extra line. So I put the <form> begin tag and hidden
inputs right after the body tag, and the closing form tag right before
the closing body tag. So, basically the form is the entire page, so
the extra line(s) created by it are above and blow the content.

How's it look?

 

[Clayburn]

Okay, I think I got it.  The problem is for some reason the </form>
creates an extra line.  So I put the <form> begin tag and hidden
inputs right after the body tag, and the closing form tag right before
the closing body tag.  So, basically the form is the entire page, so
the extra line(s) created by it are above and blow the content.

How's it look?

Well, great. Now the form isn't working.

 

[Clayburn]

Okay, I think I got it.  The problem is for some reason the </form>
creates an extra line.  So I put the <form> begin tag and hidden
inputs right after the body tag, and the closing form tag right before
the closing body tag.  So, basically the form is the entire page, so
the extra line(s) created by it are above and blow the content.

How's it look?

Okay, I think it's done. The form was working, there was just a delay
for some reason in the email for a while. I think the server was
having problems. But yeah, it seems to be working now and looks right
in IE and Firefox.

 

[dorayme]

Use divisions and set the CSS in em's.

Are you practicing, for a part in a play maybe, some sort of listening
problem?

 

[dorayme]

Okay, I think it's done.

You might be thinking that rewriting this site - as you said is your
intention - will take a while. Do not delay because of the difficulty of
making it look like this in every detail. You can make it look very
roughly similar quickly enough and add things later for the finer zing
that gives it that modern arty feel.

I assume you are aware of the screams it causes browsers that associate
with validators. Do you know that browsers like FF and iCab are mates
with their validators? They go to the pub together and take the piss out
of various sites that have come their way and their language gets pretty
rough the more they drink.

Only the other day I heard iCab saying to FF:

"Oh yeah? Well, mate, check this arty number that came my way, it was ok
for a while and I liked the nice sheila on it but f*#!* hell, maaaaate,

http://www.gelbcenter.com/pages/home.htm

HTML Error (11, 0): The tag <meta> is not allowed in its parent tag.

HTML Error (12, 0): The tag <meta> is not allowed in its parent tag.

HTML Error (13, 0): The tag <script> is not allowed in its parent tag.

HTML Error (14, 0): The tag <script> is not allowed in its parent tag.

HTML Error (28, 0): The tag <link> is not allowed in its parent tag.

HTML Error (30, 7): The tag <head> is missing.

HTML Error (34, 0): The tag <body> is not allowed in its parent tag.

HTML Error (40, 34): The attribute "alt" is missing.

HTML Error (90, 3): The tag <TABLE> is unknown.

HTML Error (92, 2): The tag <tr> is not allowed in its parent tag.

HTML Error (104, 0): The tag <center> is not allowed in its parent tag.

HTML Error (121, 10): The end tag </br> is missing.

HTML Error (123, 16): The end tag </TABLE> is unknown.

HTML Error (149, 17): The attribute "quality" is unknown.

HTML Error (149, 17): The attribute "wmode" is unknown.

HTML Error (149, 16): The tag <embed> is not allowed in the Doctype of
the document.

HTML Error (183, 54): The attribute "alt" is missing.

HTML Error (440, 29): The attribute "alt" is missing.

HTML Error (462, 24): The tag <div> is missing.

HTML Error (463, 42): The tag <td> is missing.

HTML Error (465, 19): The tag <tr> is missing.

HTML Error (467, 20): The tag <table> is missing.

HTML Error (467, 25): The tag <td> is missing.

HTML Error (469, 15): The tag <tr> is missing.

HTML Error (471, 10): The tag <tr> is not allowed in its parent tag.

HTML Error (473, 55): The attribute "alt" is missing.

HTML Error (477, 4): The tag <tr> is not allowed in its parent tag.

HTML Error (483, 16): The tag <table> is missing.

HTML Error (483, 21): The tag <td> is missing.

HTML Error (485, 11): The tag <tr> is missing.

HTML Error (487, 6): The tag <tr> is not allowed in its parent tag.

HTML Error (489, 85): The attribute "alt" is missing.

HTML Error (493, 12): The tag <table> is missing.

HTML Error (493, 17): The tag <td> is missing.

HTML Error (495, 7): The tag <tr> is missing.

HTML Error (497, 2): The tag <tr> is not allowed in its parent tag.

HTML Error (503, 8): The end tag </body> is missing.

HTML Error (503, 8): The end tag </meta> is missing.

HTML Error (503, 8): The end tag </meta> is missing.

HTML Error (503, 8): The end tag </meta> is missing.

HTML Error (503, 8): The end tag </head> is missing.

HTML Error (503, 8): The end tag </html> is missing.

HTML Error (523, 5): The tag <a> is not allowed in its parent tag.

HTML Error (525, 5): The tag <a> is not allowed in its parent tag.

HTML Error (527, 5): The tag <a> is not allowed in its parent tag.

HTML Error (529, 5): The tag <a> is not allowed in its parent tag.

HTML Error (531, 14): The tag <a> is not allowed in its parent tag.

HTML Error (533, 14): The tag <a> is not allowed in its parent tag.

HTML Error (535, 14): The tag <a> is not allowed in its parent tag.

HTML Error (535, 53): The end tag </br> is missing.

http://www.google.com/coop/cse/brand?form=cse-search-box&lang=en

HTML Error (1, 0): The tag <title> is missing.

http://adtrack.voicestar.com/euinc/number-changer.js

HTML Error (2, 0): The tag <title> is missing.

HTML Error (112, 26): The tag <SCR'> is unknown.

HTML Error (112, 26): The attribute "+" is unknown.

HTML Error (112, 26): The value of the HTML attribute "+" is missing.

HTML Error (112, 26): The attribute "'IPT" is unknown.

HTML Error (112, 26): The value of the HTML attribute "'IPT" is missing.

HTML Error (112, 58): The end tag </SCR'> is unknown.

HTML Error (133, 16): The tag <nr;> is unknown.

HTML Error (133, 16): The attribute "i++){" is unknown.

HTML Error (133, 16): The value of the HTML attribute "i++){" is missing.

HTML Error (133, 16): The attribute "if(" is unknown.

HTML Error (133, 16): The value of the HTML attribute "if(" is missing.

HTML Error (133, 16): The attribute "pd.repl" is unknown.

HTML Error (133, 16): The attribute "num" is unknown.

HTML Error (133, 16): The value of the HTML attribute "num" is missing.

HTML Error (133, 16): The attribute "||" is unknown.

HTML Error (133, 16): The value of the HTML attribute "||" is missing.

HTML Error (133, 16): The attribute "!" is unknown.

HTML Error (133, 16): The value of the HTML attribute "!" is missing.

HTML Error (133, 16): The attribute "pd.repl" is unknown.

HTML Error (133, 16): The value of the HTML attribute "pd.repl" is
missing.

HTML Error (133, 16): The attribute "){" is unknown.

HTML Error (133, 16): The value of the HTML attribute "){" is missing.

HTML Error (133, 16): The attribute "if(" is unknown.

HTML Error (133, 16): The value of the HTML attribute "if(" is missing.

HTML Error (133, 16): The attribute "pd.dont" is unknown.

HTML Error (133, 16): The value of the HTML attribute "pd.dont" is
missing.

HTML Error (133, 16): The attribute ")" is unknown.

HTML Error (133, 16): The value of the HTML attribute ")" is missing.

HTML Error (133, 16): The attribute "break;" is unknown.

HTML Error (133, 16): The value of the HTML attribute "break;" is
missing.

HTML Error (133, 16): The attribute "rw" is unknown.

HTML Error (133, 16): The attribute "if(" is unknown.

HTML Error (133, 16): The value of the HTML attribute "if(" is missing.

HTML Error (133, 16): The attribute "rw" is unknown.

HTML Error (133, 16): The value of the HTML attribute "rw" is missing.

HTML Error (133, 16): The attribute "){" is unknown.

HTML Error (133, 16): The value of the HTML attribute "){" is missing.

HTML Error (133, 16): The attribute "na" is unknown.

HTML Error (133, 16): The attribute "nb" is unknown.

HTML Error (133, 16): The attribute "nc" is unknown.

HTML Error (133, 16): The attribute "rw" is unknown.

HTML Error (133, 16): The attribute "+" is unknown.

HTML Error (133, 16): The value of the HTML attribute "+" is missing.

HTML Error (133, 16): The attribute "m[1]" is unknown.

HTML Error (133, 16): The value of the HTML attribute "m[1]" is missing.

HTML Error (133, 16): The attribute "+" is unknown.

HTML Error (133, 16): The value of the HTML attribute "+" is missing.

HTML Error (133, 16): The attribute "m[2]" is unknown.

HTML Error (133, 16): The value of the HTML attribute "m[2]" is missing.

HTML Error (133, 16): The attribute "+" is unknown.

HTML Error (133, 16): The value of the HTML attribute "+" is missing.

HTML Error (133, 16): The attribute "na" is unknown.

HTML Error (133, 16): The value of the HTML attribute "na" is missing.

HTML Error (133, 16): The attribute "+" is unknown.

HTML Error (133, 16): The value of the HTML attribute "+" is missing.

HTML Error (133, 16): The attribute "m[4]" is unknown.

HTML Error (133, 16): The value of the HTML attribute "m[4]" is missing.

HTML Error (133, 16): The attribute "+" is unknown.

HTML Error (133, 16): The value of the HTML attribute "+" is missing.

HTML Error (133, 16): The attribute "nb" is unknown.

HTML Error (133, 16): The value of the HTML attribute "nb" is missing.

HTML Error (133, 16): The attribute "+" is unknown.

HTML Error (133, 16): The value of the HTML attribute "+" is missing.

HTML Error (133, 16): The attribute "m[6]" is unknown.

HTML Error (133, 16): The value of the HTML attribute "m[6]" is missing.

HTML Error (133, 16): The attribute "+" is unknown.

HTML Error (133, 16): The value of the HTML attribute "+" is missing.

HTML Error (133, 16): The attribute "nc" is unknown.

HTML Error (133, 16): The value of the HTML attribute "nc" is missing.

HTML Error (133, 16): The attribute "+" is unknown.

HTML Error (133, 16): The value of the HTML attribute "+" is missing.

HTML Error (133, 16): The attribute "m[8];" is unknown.

HTML Error (133, 16): The value of the HTML attribute "m[8];" is missing.

HTML Error (133, 16): The attribute "this.debug("rewriting:" is unknown.

HTML Error (133, 16): The value of the HTML attribute
"this.debug("rewriting:" is missing.

HTML Error (133, 16): The attribute """ is unknown.

HTML Error (133, 16): The value of the HTML attribute """ is missing.

HTML Error (133, 16): The attribute "+" is unknown.

HTML Error (133, 16): The value of the HTML attribute "+" is missing.

HTML Error (133, 16): The attribute "numfull" is unknown.

HTML Error (133, 16): The value of the HTML attribute "numfull" is
missing.

HTML Error (133, 16): The attribute "+" is unknown.

HTML Error (133, 16): The value of the HTML attribute "+" is missing.

HTML Error (133, 16): The attribute """ is unknown.

HTML Error (133, 16): The value of the HTML attribute """ is missing.

http://www.gelbcenter.com/gelb.css

CSS Error (163, 15): The property "filter" is unknown.

CSS Error (199, 1): The property "filter" is unknown.

CSS Warning (199, 26): The property "-moz-opacity" is unknown.

CSS Error (199, 43): The property "opacity" is unknown.

...."

 

[rf]

What should I do about IE? How can I get rid of the extra space?
They sliced an image for the table background, so it's important that
they line up correctly.

I thought I explained that this is never going to happen.

You have just proved how terribly fragile this design is.

 

[rf]

Okay, I think I got it. The problem is for some reason the </form>
creates an extra line.

No, the problem is not "for some reason the </form> creates an extra line".
The problem is that the form element has, by default and per the
specifications, top and bottom margins, which may or may not collapse
depending what is before or after the form. Many elements (hn, p, etc) have
top and bottom margins.

You could have removed these margins:
form {margin: 0}

 

[richard]

Sorry, I forgot to put the URL. It's http://www.gelbcenter.com

At least with IE now that line is gone.


still, all that table stuff has to go.

 

[richard]

You might be thinking that rewriting this site - as you said is your
intention - will take a while. Do not delay because of the difficulty of
making it look like this in every detail. You can make it look very
roughly similar quickly enough and add things later for the finer zing
that gives it that modern arty feel.

I assume you are aware of the screams it causes browsers that associate
with validators. Do you know that browsers like FF and iCab are mates
with their validators? They go to the pub together and take the piss out
of various sites that have come their way and their language gets pretty
rough the more they drink.

Only the other day I heard iCab saying to FF:

"Oh yeah? Well, mate, check this arty number that came my way, it was ok
for a while and I liked the nice sheila on it but f*#!* hell, maaaaate,

http://www.gelbcenter.com/pages/home.htm

HTML Error (11, 0): The tag <meta> is not allowed in its parent tag.

HTML Error (12, 0): The tag <meta> is not allowed in its parent tag.

HTML Error (13, 0): The tag <script> is not allowed in its parent tag.

HTML Error (14, 0): The tag <script> is not allowed in its parent tag.

HTML Error (28, 0): The tag <link> is not allowed in its parent tag.

HTML Error (30, 7): The tag <head> is missing.

HTML Error (34, 0): The tag <body> is not allowed in its parent tag.

HTML Error (40, 34): The attribute "alt" is missing.

HTML Error (90, 3): The tag <TABLE> is unknown.

bwaaahhhhhhhhhhhhhhhhaaaaaaaaaaaaaaaaahahahahahaha

<table> is unknown?

I wouldn't rely on that piece of shit for validating.

 

[dorayme]

HTML Error (34, 0): The tag <body> is not allowed in its parent tag.

HTML Error (40, 34): The attribute "alt" is missing.

HTML Error (90, 3): The tag <TABLE> is unknown.

<table> is unknown?

I wouldn't rely on that piece of shit for validating.[/QUOTE]

Driver, understand that the errors need interpreting, all good
validators flag things for good reasons, but you can't be drunk when
using them. Step out of that truck and don't continue until your blood
alcohol reading subsides.

 

[Beauregard T. Shagnasty]

bwaaahhhhhhhhhhhhhhhhaaaaaaaaaaaaaaaaahahahahahaha

<table> is unknown?

No, <table> is known, but <TABLE> is not.

element "TABLE" undefined.
<TABLE cellspacing=0 border=0>
This error is often caused by:
· by using upper-case tags in XHTML (in XHTML attributes and elements
must be all lower-case).

I wouldn't rely on that piece of shit for validating.

It is an extremely good piece of shit. Unlike you, it knows that one
must use lower-case words in XHTML elements.

bwaaahhhhhhhhhhhhhhhhaaaaaaaaaaaaaaaaahahahahahaha

The page in question is a trainwreck.

 

[Neredbojias]

Clayburn wrote:

No, the problem is not "for some reason the </form> creates an extra
line". The problem is that the form element has, by default and per
the specifications, top and bottom margins, which may or may not
collapse depending what is before or after the form. Many elements
(hn, p, etc) have top and bottom margins.

You could have removed these margins:
form {margin: 0}

I'd have thought that would've been the first thing anybody suggested
to the OP.