Question

我有一个大文本文档，我使用以下CSS和div在屏幕上显示。想法是用户读下文本，3分钟后他们记录他们到达的行号，这给出了每分钟的阅读速度。

问题是IE和Chrome每行显示的字数略有不同，因此Chrome在整个页面上有189行，而IE则大约为195.有没有办法标准化每行字数？还是更好的方法呢？

欢迎任何帮助！

代码摘录如下：

.row01 {
width: 870px;
margin: 0 auto;
padding: 15px 0 0 0;
}
.col01 .numbers {
float: left;
padding-right: 4px;
padding-left: 4px;
color: #6BACC9;
font-size: 0.75em;
line-height: 1.6em;
margin-top: 1.6em;
}
.col01 .text {
float: left;
margin-left: 2px;
margin-top: 1.6em;
font-size: 0.75em;
line-height: 1.6em;
width: 830px;
}

<div class="row01">
<div class="col01">
<h2>The Time and Stress Crisis by Dr David Lewis</h2>
<div class=numbers>1. <br />2. <br />3. <br />4. <br />5. <br />6. <br />7. <br />8.     <br /></div>

<div class=text>Let me introduce you to a young acquaintance of mine - Chris.  I think    you may find you have common interests.<br />
<br />
Chris came into the office an hour early to tackle a mountain of urgent paper work.      Intimidated by the sheer size of the backlog, he found it hard to concentrate or decide his priorities.  As a result, by the time other staff arrived, his sole accomplishment had been to transform that mountain into several smaller mounds.  For the rest of the day, constant interruptions - by subordinates seeking guidance, colleagues needing to discuss departmental projects, demands from his superiors, endless telephone calls and unscheduled visitors - meant he made little further progress in catching up with his work.  Twelve hours after his working day had started, an exhausted and demoralised Chris left for home, with the backlog almost unchanged.<br />
<br /></div>
</div>
</div>

更新

即使将字体大小更改为绝对值，我仍然在长文本文档上存在IE9问题。所以我最终强迫IE9采用IE8标准：

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8" >

Answer 1

区别在于浏览器设置：

您可以设置要在浏览器中使用的标准字体和字体大小（在firefox和chrome中，这是新罗马语16）。如果元素显示为16 pt（标准浏览器设置），则'2em'为32 pt。

我建议您在css中使用实际字体大小（以磅或像素为单位）。

Answer 2

使用像素：px作为字体测量。像素完美的人一直使用它来使他们的设计在每个浏览器上看起来与完全类似。

Answer 3

你可能会发现使用像normalise.css这样的东西很有用：

http://necolas.github.com/normalize.css/

尝试在所有浏览器上显示相同内容。

对于IE和Chrome，每行保持相同的单词数

3 个答案: