I'm having trouble adjusting the height of a div so that it can be scrolled all the way through. This div is positioned next to another one, so I set the overflow-y to scroll. Initially, I thought setting the height to auto would solve the issue, but it didn't work. I also tried using JavaScript to no avail. The challenge is that the content within this DIV will vary based on user input.
Here is the CSS for the div:
#shiftToRight {
height: auto;
overflow-y: scroll;
}
And here is the div:
<div id="shiftToRight">
<div class="profile">
<h1>Admin Panel</h1>
<h4 id="editable"><a href="" class="edit-link"><i class="fa fa-edit"></i> Edit Image</a></h4>
</div>
<div id="bar"></div>
<div class="jumbotron">
<h1>John Doe 5th Class</h1>
<h3>Donec auctor tellus id metus venenatis finibus. Cras in elit.</h3>
<a href="#" id="editable"><i class="fa fa-edit"></i> Edit</a>
<div id="minor-bar"></div>
</div>
</div>
Can someone point out what I might be doing wrong? Thank you in advance!