I noticed that when I set overflow-y style of a multiline text box to
visible it is still rendered by IE7 as if the style is set to
auto or scroll - with scroll bars and the box is not expanding as text is added. Everything works as expected in IE6. I am using .NET 3.5
<form id="Form1" method="post" runat="server">
<input type="button" onclick="onButtonClick();" value="Set Overflow">
<asp:DropDownList id="DropDownList1" runat="server">
<asp:listitem value="visible">Visible</asp:listitem>
<asp:listitem value="hidden">Hidden</asp:listitem>
<asp:listitem value="scroll">Scroll</asp:listitem>
<asp:listitem value="auto">Auto</asp:listitem>
</asp:DropDownList>
<br>
<p id="testElement" style="width: 300px; height: 55px; overflow-y: visible">
All God's children are not beautiful. Most of God's children are,
in fact, barely presentable. The most common error made in
matters of appearance is the belief that one should disdain
the superficial and let the true beauty of one's soul shine
through. If there are places on your body where this is a
possibility, you are not attractive--you are leaking.<BR>
—Fran Lebowitz
</p>
</form>
Well, rendered HTML is different for p element that you have in your example and
textarea (server side multiline text boxes are rendered as textarea). As an experiment, I put
p and textarea next to each at the top of my page and set their properties the same -
p responds to setting overflow to visible, but textarea
doesn't. Textarea works properly when overflow is set to
auto or hidden; visible is the only problem - it is like there is a new value that replaced
visible in IE7.
Hi Jonathan58 Just as we discussed at
http://forums.asp.net/t/1278055.aspx Your problem is caused by the wrong DOCTYPE validation.
Per HTML and XHTML standards, a DOCTYPE (short for “document type declaration”) informs the validator which version of (X) HTML you’re using, and must appear at the very top of every web page. If you are not sure how it will affect AJAX, you can try to use the following DTD structs, which may support your AJAX code.
HTML 4.01:Strict, Transitional, Frameset
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
XHTML 1.0:Strict, Transitional, Frameset
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
XHTML 1.1 DTD
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Another way will not cause a AJAX issue is delete the
DOCTYPE line. For more information about the
DOCTYPE please check the following URL http://www.alistapart.com/articles/doctype/ If I’ve misunderstood your problem, please feel free to let me know. Thanks.
Lance Zhang
Marked as answer by Jonathan58 on Jun 25, 2008 01:12 PM
Jonathan58
Member
14 Points
31 Posts
IE7 does not render text box expansion
Jun 20, 2008 01:03 PM|LINK
Hello everyone,
I noticed that when I set overflow-y style of a multiline text box to visible it is still rendered by IE7 as if the style is set to auto or scroll - with scroll bars and the box is not expanding as text is added. Everything works as expected in IE6. I am using .NET 3.5
Any help with this will be appreciated.
NC01
All-Star
82577 Points
15430 Posts
MVP
Re: IE7 does not render text box expansion
Jun 20, 2008 05:19 PM|LINK
Seems to work for me.
<form id="Form1" method="post" runat="server">
<input type="button" onclick="onButtonClick();" value="Set Overflow">
<asp:DropDownList id="DropDownList1" runat="server">
<asp:listitem value="visible">Visible</asp:listitem>
<asp:listitem value="hidden">Hidden</asp:listitem>
<asp:listitem value="scroll">Scroll</asp:listitem>
<asp:listitem value="auto">Auto</asp:listitem>
</asp:DropDownList>
<br>
<p id="testElement" style="width: 300px; height: 55px; overflow-y: visible">
All God's children are not beautiful. Most of God's children are,
in fact, barely presentable. The most common error made in
matters of appearance is the belief that one should disdain
the superficial and let the true beauty of one's soul shine
through. If there are places on your body where this is a
possibility, you are not attractive--you are leaking.<BR>
—Fran Lebowitz
</p>
</form>
<script type="text/javascript">
<!--
function onButtonClick()
{
document.getElementById('testElement').style.overflowY = document.getElementById('DropDownList1').value;
}
// -->
</script>
NC...
Jonathan58
Member
14 Points
31 Posts
Re: IE7 does not render text box expansion
Jun 20, 2008 06:11 PM|LINK
Thanks for the reply NC...
Actually the text box I am having this problem with is server side web control with all properties including styles set in codebehind.
NC01
All-Star
82577 Points
15430 Posts
MVP
Re: IE7 does not render text box expansion
Jun 20, 2008 06:14 PM|LINK
Why would that make a difference? The rendered HTML is what makes a difference. That example should give you something to start with.
NC...
Jonathan58
Member
14 Points
31 Posts
Re: IE7 does not render text box expansion
Jun 20, 2008 09:01 PM|LINK
Well, rendered HTML is different for p element that you have in your example and textarea (server side multiline text boxes are rendered as textarea). As an experiment, I put p and textarea next to each at the top of my page and set their properties the same - p responds to setting overflow to visible, but textarea doesn't. Textarea works properly when overflow is set to auto or hidden; visible is the only problem - it is like there is a new value that replaced visible in IE7.
Jonathan58
Member
14 Points
31 Posts
Re: IE7 does not render text box expansion
Jun 20, 2008 09:33 PM|LINK
Got it to respond to overflow-y:visible by changing doctype to:
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN">
Not sure how it will affect AJAX and the other page functionality - will have to test.
Any better suggestions are welcome.
Lance Zhang ...
All-Star
33091 Points
2361 Posts
Re: IE7 does not render text box expansion
Jun 25, 2008 03:53 AM|LINK
Hi Jonathan58
Just as we discussed at http://forums.asp.net/t/1278055.aspx
Your problem is caused by the wrong DOCTYPE validation. Per HTML and XHTML standards, a DOCTYPE (short for “document type declaration”) informs the validator which version of (X) HTML you’re using, and must appear at the very top of every web page.
If you are not sure how it will affect AJAX, you can try to use the following DTD structs, which may support your AJAX code.
Another way will not cause a AJAX issue is delete the DOCTYPE line.
For more information about the DOCTYPE please check the following URL
http://www.alistapart.com/articles/doctype/
If I’ve misunderstood your problem, please feel free to let me know.
Thanks.