Form tag hogging up space

Forum Moderators: open

Message Too Old, No Replies

Form tag hogging up space

Problem with Form tag

RossWal

5:21 pm on Nov 1, 2002 (gmt 0)

I thought I posted this yesterday, but I don't see it, so I guess I got distracted and never hit submit. Anyway, I have a problem where the content within a <fo_rm> tag gets pushed down the screen abou 1/2 an inch at the beginning of the form. Not alot, but in this case it's messing up my layout. Anyone have a trick to prevent the form tag from bumping stuff down the screen?

Thanks,
Ross

madcat

5:31 pm on Nov 1, 2002 (gmt 0)

<fo_rm> --> This is correct in the code right?

What CSS margin/padding combinations have you tried to apply?

If you're really frustrated throw up some code examples.

txbakers

6:01 pm on Nov 1, 2002 (gmt 0)

<form style="margin-bottom:0"> will remove any trailing space.

Also, keep in mind that forms have to be within inline table elements <td> for example. You might want to run your resultant HTML through a validator.

tedster

7:21 pm on Nov 1, 2002 (gmt 0)

txbakers, I don't want to generate any confusion here on important terms. I think you were using the word 'inline' in an informal way. However, formally, a <td> tag is a block level tag, not an inline tag.

RossWal

8:06 pm on Nov 1, 2002 (gmt 0)

Thanks Guys.

madcat: I put the underscore in the posting to prevent the tag from messing up the html generated by WebmasterWorld. Sorry for the confusion.

This is on a page being developed in MS Visual Studio dotNet. dotNet is inserting a form tag at the very begining of the html, right after the body tag. It is not in a TD or any other tag.

Before posting I tried adding a


style="margin-top: -10px; padding-top: -10px"

to both the form tag and the first element within the form, which happens to be a table.

I'll try working the form into a td tag and see if that relieves things at all. Otherwise I'll post some trimmed down code.

Thanks again.

txbakers

9:36 pm on Nov 1, 2002 (gmt 0)

Ted - you're right, my mistake. But it does need to be in a block tag, rather than just under the table or tr tags.

imaputz

2:53 am on Nov 2, 2002 (gmt 0)

RossWal: I think you're on the right track... but you should try setting the margins to zero instead of a negative value.

on the form tag:
style="margin-top:0px; margin-bottom:0px;"

hope that helps.

RossWal

6:46 pm on Nov 4, 2002 (gmt 0)

Thanks for the input and commentary. Just got back to it now and found the problem was corrected by wrapping the form in a table/tr/td. I also tried wrapping it in a div with display: block, but that didn't seem to have any effect.

I wonder what the possible rationale could be for requiring that a form be inside a table element? Hmmm...

pageoneresults

6:54 pm on Nov 4, 2002 (gmt 0)

This one solves the problem everytime...

form{display:inline;}

Forget about margins. Forget about padding. I've tried all of them and the display:inline seems to be the best solution.

GaryK

6:55 pm on Nov 4, 2002 (gmt 0)

Sorry to arrive late to this discussion. It's been my experience that it's where the </form> tag is placed that can cause problems with white space above the <form> tag. Basically this is what I do and it works fine in all browsers I've tested it in:

content

</form>
</body>

If the closing form tag is anywhere except right before the closing body tag the spacing problems you mention will happen.

At least that's been my experience.