#12307 closed defect (wontfix)
IE7 ValidationTextBox in div with scroll bar
Reported by: | JRI | Owned by: | Douglas Hays |
---|---|---|---|
Priority: | high | Milestone: | tbd |
Component: | Dijit - Form | Version: | 1.5 |
Keywords: | ValidationTextBox dijitInputContainer overflow | Cc: | |
Blocked By: | Blocking: |
Description
Using dijit.form.ValidationTextBox? on a div with a scroll bar will display all text input with a fixed position on IE 7 (7.0.5730.13) and IE 6
Example :
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html lang="fr"> <head> <SCRIPT type="text/javascript" src="dojo/dojo.js" djConfig="isDebug: false, parseOnLoad: true"></SCRIPT> <LINK rel="stylesheet" href="dijit/themes/tundra/tundra.css" type="text/css"> <style> /* overwrite .dijitInputContainer position:relative in dijit/themes/dijit.css */ /*.dijitInputContainer { position:static; }*/ </style> </head> <BODY class="tundra"> <script type="text/javascript"> dojo.require("dijit.form.ValidationTextBox"); dojo.require("dojo.parser"); </script> <br><br><br><br><br> <form action="#" method="GET"> <div style="overflow: auto; width: 350px; height: 200px;"> <table> <TR><TD><input type="text" dojoType="dijit.form.ValidationTextBox" value="100,00" id="_1"></TD></TR> <TR><TD><input type="text" dojoType="dijit.form.ValidationTextBox" value="100,00" id="_2"></TD></TR> <TR><TD><input type="text" dojoType="dijit.form.ValidationTextBox" value="100,00" id="_3"></TD></TR> <TR><TD><input type="text" dojoType="dijit.form.ValidationTextBox" value="100,00" id="_4"></TD></TR> <TR><TD><input type="text" dojoType="dijit.form.ValidationTextBox" value="100,00" id="_5"></TD></TR> <TR><TD><input type="text" dojoType="dijit.form.ValidationTextBox" value="100,00" id="_6"></TD></TR> <TR><TD><input type="text" dojoType="dijit.form.ValidationTextBox" value="100,00" id="_7"></TD></TR> <TR><TD><input type="text" dojoType="dijit.form.ValidationTextBox" value="100,00" id="_8"></TD></TR> <TR><TD><input type="text" dojoType="dijit.form.ValidationTextBox" value="100,00" id="_9"></TD></TR> <TR><TD><input type="text" dojoType="dijit.form.ValidationTextBox" value="100,00" id="_10"></TD></TR> <TR><TD><input type="text" dojoType="dijit.form.ValidationTextBox" value="100,00" id="_11"></TD></TR> <TR><TD><input type="text" dojoType="dijit.form.ValidationTextBox" value="100,00" id="_12"></TD></TR> <TR><TD><input type="text" dojoType="dijit.form.ValidationTextBox" value="100,00" id="_13"></TD></TR> <TR><TD><input type="text" dojoType="dijit.form.ValidationTextBox" value="100,00" id="_14"></TD></TR> <TR><TD><input type="text" dojoType="dijit.form.ValidationTextBox" value="100,00" id="_15"></TD></TR> </table> </div> </form> </BODY> </html>
I found 2 way to avoid this :
- Remove or overwrite the style "position:relative;" style on .dijitInputContainer in dijit/themes/dijit.css.
- Remove DOCTYPE on top off the page (which mean quirk mode...)
Change History (4)
comment:1 Changed 10 years ago by
Owner: | set to Douglas Hays |
---|
comment:2 Changed 10 years ago by
comment:3 Changed 10 years ago by
Resolution: | → wontfix |
---|---|
Status: | new → closed |
Just add position:relative to your scrollable DIV
comment:4 Changed 10 years ago by
Component: | Dijit → Dijit - Form |
---|
Note: See
TracTickets for help on using
tickets.
I'm guessing that position:relative is there for the placeHolder support.