Hi guys,
I am new in html. i have problem while creating a screen. when i scroll down my TD field completely overlap to TH field. I got one code from google. i goes well till my input field is text. but when i used select option in html, it ovelap to my TH. i send u my code to u. and same vbscript behind this code.
Please correct me.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML><HEAD><TITLE>Freeze Foot</TITLE>
<META http-equiv=Content-Type content="text/html; charset=windows-1252">
<META content="MSHTML 6.00.2900.2180" name=GENERATOR>
<link href="warehouse/external_css_file.css" rel="stylesheet" type="text/css">
<style>
.select{
outline:groove;
overflow:hidden;
border-width: thin;
border-color: #000000;
}
</style>
</HEAD>
<BODY><!-- CSS style to support freeze footer -->
<form action="formout.php" method="post">
<H2 align=center> </H2>
<STYLE type="text/css">
THEAD TH {
BORDER-RIGHT: silver 1px thin; CURSOR: default; POSITION: relative; BACKGROUND-COLOR: silver; font-size:14px;
}
THEAD TH.locked {
BORDER-RIGHT: silver 1px thin; CURSOR: default; POSITION: relative; BACKGROUND-COLOR: silver; font-size:14px;
}
THEAD TH {
Z-INDEX: 20; ; TOP: expression(parentNode.parentNode.parentNode.parentNode.scrollTop-2)
}
THEAD TH.locked {
Z-INDEX: 30
}
TD.locked {
Z-INDEX: 10; ; LEFT: expression(parentNode.parentNode.parentNode.parentNode.scrollLeft); POSITION: relative; BACKGROUND-COLOR: #ffeaff
}
TH.locked {
Z-INDEX: 10; ; LEFT: expression(parentNode.parentNode.parentNode.parentNode.scrollLeft); POSITION: relative; BACKGROUND-COLOR: #ffeaff
}
TFOOT TR {
Z-INDEX: 20; POSITION: relative; ; TOP: expression(parentNode.parentNode.parentNode.TopOfFooter)
}
.select { position:relative; z-index:-20;}
</STYLE>
</p>
<DIV id=tbl-container align="center"
style="BEHAVIOR: url('file:///D|/swapnilwork/freezeFoot.htc'); OVERFLOW:scroll; WIDTH:450px; SCROLLBAR-BASE-COLOR: #ffeaff; HEIGHT: 200px" >
<table bgcolor=white align="center">
<thead>
<tr>
<th><div align="center">Item Name</div></th>
<th><div align="center">Bags</div></th>
<th><div align="center">Quantity</div></th>
<th><div align="center">UOM Name</div></th>
<th><div align="center">Shift</div></th>
<th>Remarks</th>
</tr>
</thead>
<tbody>
<tr>
<td><input name="itmnm" type="text" id="itmnm" size="40"></td>
<td><input name="Bags" type="text" id="bags" size="15"></td>
<td><input name="qty" type="text" id="qty" size="10"></td>
<td><input name="uomname" type="text" id="uomname" size="15"></td>
<td><label>
<select name="select" size="1" class="select" >
</select>
</label></td>
<td><input name="remark" type="text" id="remark" size="40"></td>
</tr>
<tr>
<td><input name="itmnm" type="text" id="itmnm" size="40"></td>
<td><input name="Bags" type="text" id="bags" size="15"></td>
<td><input name="qty" type="text" id="qty" size="10"></td>
<td><input name="uomname" type="text" id="uomname" size="15"></td>
<td><label>
<select name="select2" class="select" id="select2">
</select>
</label></td>
<td><input name="remark" type="text" id="remark" size="40"></td>
</tr>
<tr>
<td><input name="itmnm" type="text" id="itmnm" size="40"></td>
<td><input name="Bags" type="text" id="bags" size="15"></td>
<td><input name="qty" type="text" id="qty" size="10"></td>
<td><input name="uomname" type="text" id="uomname" size="15"></td>
<td><label>
<select name="select3" class="select" id="select3">
</select>
</label></td>
<td><input name="remark" type="text" id="remark" size="40"></td>
</tr>
<tr>
<td><input name="itmnm" type="text" id="itmnm" size="40"></td>
<td><input name="Bags" type="text" id="bags" size="15"></td>
<td><input name="qty" type="text" id="qty" size="10"></td>
<td><input name="uomname" type="text" id="uomname" size="15"></td>
<td><label>
<select name="select4" class="select" id="select4">
</select>
</label></td>
<td><input name="remark" type="text" id="remark" size="40"></td>
</tr>
<tr>
<td><input name="itmnm" type="text" id="itmnm" size="40"></td>
<td><input name="Bags" type="text" id="bags" size="15"></td>
<td><input name="qty" type="text" id="qty" size="10"></td>
<td><input name="uomname" type="text" id="uomname" size="15"></td>
<td><label>
<select name="select5" size="1" class="select" id="select5">
</select>
</label></td>
<td><input name="remark" type="text" id="remark" size="40"></td>
</tr>
<tr>
<td><input name="itmnm" type="text" id="itmnm" size="40"></td>
<td><input name="Bags" type="text" id="bags" size="15"></td>
<td><input name="qty" type="text" id="qty" size="10"></td>
<td><input name="uomname" type="text" id="uomname" size="15"></td>
<td><label>
<select name="select6" id="select6">
</select>
</label></td>
<td><input name="remark" type="text" id="remark" size="40"></td>
</tr>
<tr>
<td><input name="itmnm" type="text" id="itmnm" size="40"></td>
<td><input name="Bags" type="text" id="bags" size="15"></td>
<td><input name="qty" type="text" id="qty" size="10"></td>
<td><input name="uomname" type="text" id="uomname" size="15"></td>
<td><label>
<select name="select7" id="select7">
</select>
</label></td>
<td><input name="remark" type="text" id="remark" size="40"></td>
</tr>
<tr>
<td><input name="itmnm" type="text" id="itmnm" size="40"></td>
<td><input name="Bags" type="text" id="bags" size="15"></td>
<td><input name="qty" type="text" id="qty" size="10"></td>
<td><input name="uomname" type="text" id="uomname" size="15"></td>
<td><label>
<select name="select8" id="select8">
</select>
</label></td>
<td><input name="remark" type="text" id="remark" size="40"></td>
</tr>
</tbody>
</table>
</DIV>
</form>
</BODY>
</HTML>
Full Version: overlapping problem
Can you provide the URL (address) of a document that demonstrates the problem?
Hi darin,
I send u screenshot of my problem. In that screen, you see that while scrolling verical bar my list menu field overlap my TH field , while other field goes very well.
Please suggest me any correction if required.
I send u screenshot of my problem. In that screen, you see that while scrolling verical bar my list menu field overlap my TH field , while other field goes very well.
Please suggest me any correction if required.
A screenshot won't help. We need to see the page itself.
QUOTE(swapnil @ Oct 20 2008, 01:23 PM) 
when i scroll down my TD field completely overlap to TH field.
Isn't that what you want?
Anyway you use CSS "expression" properties for this, but "expression" only works in MSIE. The effect in MSIE is that the top row stays fixed while the rest of the table is scrolled, similar but not identical to http://www.htmlhelp.com/test/tbody.html (doesn't work in MSIE). QUOTE
i goes well till my input field is text. but when i used select option in html, it ovelap to my TH.
Didn't follow that.
QUOTE
<META content="MSHTML 6.00.2900.2180" name=GENERATOR>
This looks like MS FrontPage or similar editor, which usually creates very poor HTML. E.g., in your code example there's a STYLE section inside the page's BODY, where it's not allowed. The validator will point out such errors and others (though the result might seem intimidating at first): http://htmlhelp.com/tools/validator/
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.