How can I get a div that treats line breaks as sig

Question

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,

Answer 1

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

Check this fiddle. Is this what you want?