How to make ul extend past parent div?

I have a container div with a set width and height and the overflow set to auto. Inside, there is an unordered list with content that causes the div to scroll.

The problem is that the list itself does not extend past the container div. So when I try to add padding to the right side of the list, it doesn't work properly:

CSS

.container {
    width: 200px;
    height: 400px;
    overflow: auto;
}

ul {
    list-style-type: none; 
    margin: 0;
    padding: 0 10px 0 0;
    white-space: nowrap;
}

Here's a fiddle that shows the problem: http://ift.tt/1GCwFid