我有一个使用以下 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" >