谷歌浏览器无法正确呈现溢出答案

【问题标题】：Google Chrome not rendering overflow correctly谷歌浏览器无法正确呈现溢出
【发布时间】：2012-03-23 05:57:00
【问题描述】：

我刚刚发现当使用align=right 属性时，这个ASP.Net 服务器控件水平滚动不起作用！我深入研究了 HTML 生成的代码，发现了这样的内容：

<div align="right" style="overflow:scroll; width: 200px; height:200px;">
    <div style="width:400px; height:400px">
    </div>
</div>

水平滚动条在您删除align="right" 属性时出现。在 Chrome 17/18 中测试。它在 Firefox 10 和 IE 10 中运行良好

有什么解决方法吗？

PS。我应该将错误提交给谷歌浏览器的人吗？这听起来像是一个 webkit 错误！

【问题讨论】：

您使用的是什么文档类型？我认为div 元素不再具有align 属性。
这不是错误。 align 属性已被弃用。

标签： asp.net html css google-chrome overflow

【解决方案1】：

我认为使用 CSS (float:right;) 并取消 align 属性可以解决问题。

http://jsfiddle.net/rdjRS/

这就是你的目标吗？

更新：我假设您可以添加 javascript，但不能删除 javascript。您可以尝试将此代码包含到您的 javascript 中吗？它使元素向右浮动，然后删除不推荐使用的 align 属性。

    <script src="http://code.jquery.com/jquery-1.7.1.min.js" type="text/javascript"L></script>
    <script type="text/javascript">
        $('[align="right"]').css('float', 'right').removeAttr('align');
    </script>

是的，它依赖于 jQuery。

如您所见，它无需删除任何已经存在的 HTML 或 CSS 即可工作。 http://jsfiddle.net/hLg73/

【讨论】：

我可以使用 text-align css 属性，但是我无法访问服务器控件，服务器控件是我们在 ASP.Net 表单中使用的第三方 UI 组件！跨度>
那么你能控制什么？的CSS？ Javascript？
html代码是由JavaScript类在运行时动态生成的，我相信我需要破解JS类的Render方法来改变行为！值得一试，但我不喜欢这个解决方案
是的，David，这行得通，只是对组件的 Render 方法进行了一些更改...我不得不重写 Render 方法来做它正在做的事情以及上面的代码...谢谢

【解决方案2】：

div 属性 align 已被弃用...

http://www.w3.org/TR/html4/present/graphics.html#h-15.1.2

因此，我不认为您可以在渲染不正确时归咎于浏览器错误。

我会推荐使用CSS来实现这个效果，比如float: right;作为一个例子。

【讨论】：