Reputation: 1335
I am trying to get a vertical scrollbar on my div. The id is "both". I can only get the scroll to show if I have pixelated height and width. It is not working for percents. Below is html.
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<html>
<body>
<div id="both">
<h1>Sir Isaac Newton</h1>
<img id="newton" src="https://lh5.googleusercontent.com/4MW-UzVwXP-y7aJulVuUuyY-fxDZ0k5dBdzKBC-ScBfEXmbk7TwV_iTnESdThc6oKCjVuBviQIrot7A=w1570-h822"></img>
</div>
</body>
</html>
Below is css
#newton {
width: 20%;
height: 20%;
}
#both {
height: 100%;
width: 100%;
overflow-y: scroll;
}
Upvotes: 0
Views: 46
Reputation: 67778
You need to add this rule to your CSS to have a height reference for the percentage heights of your elements:
html, body {
height: 100%;
}
Upvotes: 1