How can I get a div that treats line breaks as significant to scroll if it exceeds a certain height?

问题

I have code like the following:

<div style="height: 100px; max-height: 100px; white-space: pre-wrap;">
a
b
c
d
e
f
g
h
i
j
k
l
m
n
o
p
q
r
s
t
u
v
w
x
y
z
</div>

When I load that page in a browser, it displays, vertically, the lowercase alphabet, and does not scroll.

What should I do differently so that the DIV retains source line breaks, but has exactly the height I specify, with a scrollbar if the content height exceeds the maximum I have set?

Thanks,

回答1:

Just add overflow: auto or overflow: scroll to your div.

Check this fiddle. Is this what you want?

来源：https://stackoverflow.com/questions/25089663/how-can-i-get-a-div-that-treats-line-breaks-as-significant-to-scroll-if-it-excee