Why <intput> tag overwrite the <td> tag

R

RC

I have a very sime html table like
<html><head><title>My Table</title>
<style>
input { margin: 0; padding: 0; border-width: 0;
text-indet: 0; text-align: left }
</style></head><body>

<table border="1" width="100%">
<caption>Table Title</caption>
<tr>
<th width="25%">Col1></th>
<th width="25%">col2</th>
<th width="25%">col3</th>
<th width="25%">col4</th>
</tr>

<tr>
<td width="25%">
<input type="text" name="name1" value="" size="2" />
</td>
<td width="25%">
<input type="text" name="name2" value="" size="2" />
</td>
<td width="25%">
<input type="text" name="name3" value="" size="2" />
</td>
<td width="25%">
<input type="text" name="name4" value="" size="2" />
</td>
</tr>

</table></body></html>

Everything is fine, except the table width is over 100% of window
browser width, the browser auto have a horizontal scroll bar at bottom.
So I can only see 80% of the table, need to scroll the horizontal scroll
bar right and left.

I have 17" LCD screen with 1280x1024 resolution, it is wide enough
for a such small table maximum length only 8 characters.

If I take out all the <input> tags inside the <td> tags, then I got
exactly what I want, 100% table show on the browser window without the
horizontal scrolling bar.

Why the <input> tag increase the width of <td> tag?
How can I see the 100% of table on browser window?

Thank Q very much in advance!

P.S. the reason I posted this in XML group.
Because this is XSLT convert from XML to HTML
 
X

Xandax

RC skrev:
I have a very sime html table like
<html><head><title>My Table</title>
<style>
input { margin: 0; padding: 0; border-width: 0;
text-indet: 0; text-align: left }
</style></head><body>

<table border="1" width="100%">
<caption>Table Title</caption>
<tr>
<th width="25%">Col1></th>
<th width="25%">col2</th>
<th width="25%">col3</th>
<th width="25%">col4</th>
</tr>

<tr>
<td width="25%">
<input type="text" name="name1" value="" size="2" />
</td>
<td width="25%">
<input type="text" name="name2" value="" size="2" />
</td>
<td width="25%">
<input type="text" name="name3" value="" size="2" />
</td>
<td width="25%">
<input type="text" name="name4" value="" size="2" />
</td>
</tr>

</table></body></html>

Everything is fine, except the table width is over 100% of window
browser width, the browser auto have a horizontal scroll bar at bottom.
So I can only see 80% of the table, need to scroll the horizontal scroll
bar right and left.

I have 17" LCD screen with 1280x1024 resolution, it is wide enough
for a such small table maximum length only 8 characters.

If I take out all the <input> tags inside the <td> tags, then I got
exactly what I want, 100% table show on the browser window without the
horizontal scrolling bar.

Why the <input> tag increase the width of <td> tag?
How can I see the 100% of table on browser window?

Thank Q very much in advance!

P.S. the reason I posted this in XML group.
Because this is XSLT convert from XML to HTML


Could it have something to do with your additional > after Col1 in this
line:
<th width="25%">Col1></th>
Otherwise, I don't seem to have any problem viewing the table in any
resolution.
 
B

Beauregard T. Shagnasty

Xandax said:
RC skrev:

Sime? Simple?

text-indet is not valid CSS.

The extra > makes no difference to my browser.
Could it have something to do with your additional > after Col1 in this
line:
<th width="25%">Col1></th>
Otherwise, I don't seem to have any problem viewing the table in any
resolution.

I see it functioning correctly, even after I removed the invalid CSS
(and that >). Firefox 1.0.7

Methinks the OP is not telling the whole story. URL please?
 
J

Jim Moe

RC said:
I have a very sime html table like
[...]
Everything is fine, except the table width is over 100% of window
browser width, the browser auto have a horizontal scroll bar at bottom.
So I can only see 80% of the table, need to scroll the horizontal scroll
bar right and left.
It works fine here even after adding a DOCTYPE. Mozilla v1.7.12.
What browser are you using?
Post an URL demonstrating the problem.
 

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,995
Messages
2,570,230
Members
46,819
Latest member
masterdaster

Latest Threads

Top