offsetWidth or CSS expression problem for IE6
I need to set the width of textboxes as 80% of it's parent. So first I used
td input[type="text"]
{
width: 80%;
}
But it was not rendering properly if the input
is the child of td
. So, I used Css expressions
td input[type="text"]
{
width: expression(this.parentNode.offsetWidth*0.8);
}
It is working as I wanted in every browser except开发者_Python百科 IE 6. Can anybody help me, where I am going wrong? I know that expressions are allowed in IE 6. So, is it the problem of using css expression or something to do offsetWidth.
Thanks in advance.
td input[type="text"]
Attribute selectors don't work in IE6. If you want to support this browser, add a class="text"
and style on td input.text
.
You shouldn't need anything complex with scripts, jQuery or expressions.
try rewriting as
* html td input[type="text"]
{
width: expression(this.parentNode.offsetWidth*0.8) !important;
}
however my own alternative method would be to detect ie version and if its 6 redirect to an error page with a angry face alerting to the user : Its 21st Century you moron! Update!
:)
Sorry I am writing answer for my own question, thought if somebody can get help from this.
I tried many things from CSS, nothing worked in IE 6. So, finally used jquery
if (jQuery.browser.msie && jQuery.browser.version.substring(0, 1) == "6") {
$("td > input[type='text']").each(function() {
$(this).css("width", $(this).parent().width() * 0.80);
});
}
It worked for me fine.
I believe this issue is caused by the ie 6 box model. The width and height include the padding and the borders. See here for more info.
精彩评论