How do I get IE and Mozilla to show the right border for an input tag.
for the following table
Everything looks great until I add the doctype tag.
I can get IE to work by adding the following.
table.resizable td{
overflow: hidden;
padding-right:6px.
}
This does not seem to work for Mozilla.
Any help would be greatly appreciated.
Steve
[HTML]
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<HTML>
<HEAD>
<TITLE>css demo</TITLE>
<style type="text/css">
table.resizable{
table-layout:fixed;
}
table.resizable th{
text-align:left;
overflow: hidden;
}
table.resizable td{
overflow: hidden;
}
table.resizable input{
width:100%;
}
table.resizable textarea{
width:100%;
}
</style>
</HEAD>
<BODY>
<TABLE border="1" class="resizable">
<THEAD>
<TR>
<TH width="50px">name</TH>
<TH style="width:60px">input</TH>
</TR>
</THEAD>
<TBODY>
<TR>
<TD>name</TD>
<TD><input type="text" value="this is a very long text string, this is a very long text string"></TD>
</TR>
<TR>
<TD>name</TD>
<TD><input type="text" value="this is a very long text string, this is a very long text string"></TD>
</TR>
<TR>
<TD>name</TD>
<TD><input type="text" value="this is a very long text string, this is a very long text string"></TD>
</TR>
<TR>
<TD>name</TD>
<TD><input type="text" value="this is a very long text string, this is a very long text string"></TD>
</TR>
</TBODY>
</TABLE>
</BODY>
</HTML>
[/HTML]