<Form> does not validate depending where it is in the table?

[Sims]

Hi,

This will validate, (http://validator.w3.org/)

<form method="POST" action="" name='xForm' style='background:inherit;'>
<table style='background:inherit; width:100%;'>
<tr width=80%>
<td>
<input type="text" value="search" style="width:100%; text-align:left;">
</td>
<td width=20%>
<input type="submit" value="go" style="width:100%; text-align:left;">
</td>
</tr>
</table>
</form>

But this will not,

<table style='background:inherit; width:100%;'>
<form method="POST" action="" name='xForm' style='background:inherit;'>
<tr width=80%>
<td>
<input type="text" value="search" style="width:100%; text-align:left;">
</td>
<td width=20%>
<input type="submit" value="go" style="width:100%; text-align:left;">
</td>
</tr>
</form>
</table>

(the <form> is inside the <table> tag). Why is it different?

The reason why i ask is because i want to place the valid code above in
another table, (the code above will be a cell of a table), but internet
explorer makes the height of the cell greater. The two inputs are correctly
side by side but if i put the 'valid' code in the cell then the height is
valid.

the cell that are wrong are,

<table style='background:inherit; width:100%;'>
<tr>
<td>Item 1</td>
<td>Item 2</td>
<td>Item 3</td>
<td>Item 4</td>
<td><!-- Valid form --></td>
<tr>
<table>

Many thanks for your input.

Sims

[Karl Core]

"Sims" <si*********@hotmail.com> wrote in message
news:c3*************@ID-162430.news.uni-berlin.de...

Hi,

This will validate, (http://validator.w3.org/)

<form method="POST" action="" name='xForm' style='background:inherit;'>
<table style='background:inherit; width:100%;'>
<snip>
But this will not,

<table style='background:inherit; width:100%;'>
<form method="POST" action="" name='xForm' style='background:inherit;'>
<tr width=80%>
<snip>

This is as it should be.
<form> is simply not something that is part of a table.
http://www.w3.org/TR/REC-html40/struct/tables.html
(the <form> is inside the <table> tag). Why is it different?

The reason why i ask is because i want to place the valid code above in
another table, (the code above will be a cell of a table), but internet
explorer makes the height of the cell greater. The two inputs are correctly side by side but if i put the 'valid' code in the cell then the height is
valid.

<form> has default margin.
Remove it with CSS
--

Karl Groves
http://www.karlcore.com

[Steve Pugh]

"Sims" <si*********@hotmail.com> wrote:

This will validate, (http://validator.w3.org/)

<form method="POST" action="" name='xForm' style='background:inherit;'>
<table style='background:inherit; width:100%;'>

</table>
</form>

But this will not,

<table style='background:inherit; width:100%;'>
<form method="POST" action="" name='xForm' style='background:inherit;'> </form>
</table>

(the <form> is inside the <table> tag). Why is it different?
Look at the HTML specification. The only elements that can be direct
children of table are caption, tr, tbody, thead and tfoot.

The form must either surround the whole table, or be contained within
a single table cell.
The reason why i ask is because i want to place the valid code above in
another table, (the code above will be a cell of a table), but internet
explorer makes the height of the cell greater.

By default form elements have a margin. Set this margin to zero in
your CSS and the extra space will porobably vanish (but we can't be
sure because you didn't supply a URL).

Steve

--
"My theories appal you, my heresies outrage you,
I never answer letters and you don't like my tie." - The Doctor

Steve Pugh <st***@pugh.net> <http://steve.pugh.net/>

[Sims]

<form method="POST" action="" name='xForm' style='background:inherit;'>
<table style='background:inherit; width:100%;'>

<snip>

But this will not,

<table style='background:inherit; width:100%;'>
<form method="POST" action="" name='xForm' style='background:inherit;'>
<tr width=80%>

<snip>

This is as it should be.
<form> is simply not something that is part of a table.
http://www.w3.org/TR/REC-html40/struct/tables.html

Thanks both of you, (and the others), i didn't know that forms had a margin.
I will change it now.

Many thanks.

Sims

[Michael Winter]

On Tue, 16 Mar 2004 13:30:00 +0200, Sims <si*********@hotmail.com> wrote:

This will validate, (http://validator.w3.org/)
[FORM element outside TABLE]
But this will not,
[FORM element inside TABLE]
(the <form> is inside the <table> tag). Why is it different?
Only certain elements can be a direct child of a TABLE element. These are:
CAPTION, COL, COLGROUP, TBODY, THEAD, TFOOT, and TR[1]. There are
restrictions to how they are used, which are best expressed in the
document type definition.
The reason why i ask is because i want to place the valid code above in
another table, (the code above will be a cell of a table), but internet
explorer makes the height of the cell greater. The two inputs are
correctly side by side but if i put the 'valid' code in the cell then
the height is valid.

IE is adding a margin to the form, which makes the cell taller. Styling
the form with

margin: 0

keeps everything in line.

[snipped containing table]

Mike
[1] If a TR is added without including a TBODY element, the TBODY is
inserted implicitly.

--
Michael Winter
M.******@blueyonder.co.invalid (replace ".invalid" with ".uk" to reply)