预李里：在Chrome和IE9

固定格式我有这个网站：预李里：在Chrome和IE9

<!DOCTYPE html> 
<html> 
<head> 
<style> 
pre { 
    overflow: auto; 
} 
</style> 
</head> 

<body> 
<ol> 
<li> 
<pre>some 
code code code code code code code code code code code code code code code code code code code 
code code</pre></li> 
<li><pre>some more code code code code code code code code code code code code code code code code code code code code code</pre></li> 
</ol> 
</body> 
</html>

这样做的目的是，这将导致文本预格式化位的编号列表。当这些文本位很长时，将通过溢出来添加滚动条：auto;。

这可以在Firefox 20中正常工作。但是，在IE9中，预格式化文本向下移动一行（因此每个项目现在需要两行，一个用于数字，一个用于预格式化文本）。在Chrome中，格式是正确的，只是数字不显示。

我试着改变溢出：滚动，无济于事。也试图改变DOCTYPE到< DOCTYPE HTML PUBLIC！ “ - // W3C // DTD XHTML 1.0过渡// EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>无济于事。

的问题消失在Chrome和IE9当你取出溢出：汽车;，但是你再也没有拿到滚动条了，这对我很重要。

有没有一种方法，使本次车展正确不仅在Firefox，但IE9和Chrome呢？

来源

2013-05-09 user1147862

我无法重现这个问题在Chrome或Internet Explorer（8，9或10）前添加一个空pseudoelement。你*积极*，你没有任何遗弃标签？ http://dirtymarkup.com && http://validator.w3.org – ParrotMac 2013-05-09 02:33:45

经过一番尝试，我发现问题是由溢出引起的：auto或overflow：scroll。我编辑了我最初的问题来反映这一点。 – user1147862 2013-05-09 04:01:20

你有没有找到解决方案？我现在有与Chrome 33.0.1750.152相同的行为。解决这个问题的唯一方法是在'pre'元素前添加额外的流内容（或者禁用'overflow：auto'）... – DMKE 2014-03-28 16:41:06

每李

li:before { 
content: ""; 
}

来源

2016-07-05 11:12:34

预李里：在Chrome和IE9

回答

相关问题