在博主中，溢出在 IE 中不起作用
in blogger, overflow doesn't work in IE
这是我的博客linkhttp://testt0646t.blogspot.tw/2017/06/test.html
如果用chrome或者firefox打开，会发现scroll效果很好；但是，如果你用IE打开，你会发现卷轴不起作用。我尝试在互联网上搜索，但没有发现任何有用的信息。我认为我的原因是 HTML 语法 overflow:auto 不起作用，有人可以帮我解决这个问题吗？
<div style="background: #ffffff; border-width: 0.1em 0.1em 0.1em 0.8em; border: solid gray; overflow: auto; padding: 0.2em 0.6em; width: auto;">
<pre style="line-height: 125%; margin: 0;"><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span>
</pre>
</div>
将 word-wrap:normal 添加到 pre 元素应该可以解决问题。由于 Blogger 添加到 body 元素
的 word-wrap:break-word 属性 导致出现此问题
<div style="background: #ffffff; border-width: 0.1em 0.1em 0.1em 0.8em; border: solid gray; overflow: auto; padding: 0.2em 0.6em; width: auto;">
<pre style="word-wrap:normal;line-height: 125%; margin: 0;"><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span>
</pre>
</div>
这是我的博客linkhttp://testt0646t.blogspot.tw/2017/06/test.html
如果用chrome或者firefox打开，会发现scroll效果很好；但是，如果你用IE打开，你会发现卷轴不起作用。我尝试在互联网上搜索，但没有发现任何有用的信息。我认为我的原因是 HTML 语法 overflow:auto 不起作用，有人可以帮我解决这个问题吗？
<div style="background: #ffffff; border-width: 0.1em 0.1em 0.1em 0.8em; border: solid gray; overflow: auto; padding: 0.2em 0.6em; width: auto;">
<pre style="line-height: 125%; margin: 0;"><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span>
</pre>
</div>
将 word-wrap:normal 添加到 pre 元素应该可以解决问题。由于 Blogger 添加到 body 元素
<div style="background: #ffffff; border-width: 0.1em 0.1em 0.1em 0.8em; border: solid gray; overflow: auto; padding: 0.2em 0.6em; width: auto;">
<pre style="word-wrap:normal;line-height: 125%; margin: 0;"><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span><span style="color: #008800; font-weight: bold;">print</span> <span style="background-color: #fff0f0;">'hello world!'</span>
</pre>
</div>