jquery autogrow 和 yui-reset 会导致 IE7 中出现不良行为

发布于 2024-07-27 19:56:05 字数 1304 浏览 4 评论 0原文

我在同一个站点上一起使用 YUI Reset 和 jquery AutoGrow 。它在 Firefox 上运行良好，但在 IE 7 上表现不佳。文本区域变得很大，即使其中只有少量文本。

下面是一个演示该问题的示例。如果我注释掉重置样式表，自动增长就会正常运行。

我希望有一些简单的 CSS 可以覆盖它来解决这个问题。我已经深入这个项目以摆脱 YUI 重置。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title></title>
    <link href="http://yui.yahooapis.com/2.7.0/build/reset/reset-min.css" rel="stylesheet" type="text/css" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
    <script src="http://www.aclevercookie.com/files/jquery.autogrow.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function() {
            $("textarea").autogrow();
        });
    </script>
    <style type="text/css">
        textarea
        {
            width: 99%;
            line-height: 18px;
        }
    </style>
</head>
<body>
    <textarea>abc</textarea>
    <textarea>this quantity of text should not cause the textarea to grow yet.</textarea>
</body>
</html>

原文

I am using YUI reset and jquery AutoGrow together on the same site. It works fine on firefox, but IE 7 behaves badly. The textarea grows way to big with even a small amount of text in it.

Below is an example that demonstrates the problem. If I comment out the reset stylesheet, the autogrow behaves properly.

I am hoping there is some simple css that I can override that will fix this. I am way to far into this project to switch away from YUI reset.

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title></title>
    <link href="http://yui.yahooapis.com/2.7.0/build/reset/reset-min.css" rel="stylesheet" type="text/css" />
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js" type="text/javascript"></script>
    <script src="http://www.aclevercookie.com/files/jquery.autogrow.js" type="text/javascript"></script>
    <script type="text/javascript">
        $(function() {
            $("textarea").autogrow();
        });
    </script>
    <style type="text/css">
        textarea
        {
            width: 99%;
            line-height: 18px;
        }
    </style>
</head>
<body>
    <textarea>abc</textarea>
    <textarea>this quantity of text should not cause the textarea to grow yet.</textarea>
</body>
</html>

分享到QQ

分享到微博