tipr tooltip z-index not working

Question

I've a problem with the tooltip: I want to show the tooltip over the div.container, I tried to edit z-index(1 in div.container, 9999 in tooltip), but nothing works.

jsfiddle: http://jsfiddle.net/9mss22xz/

div.tip {
    background-color: #f3f3f3;
    border: solid 1px #cfcfcf;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px; 
    height: 55px;
    width: 55px;
    float: left;
    margin: 4px;
    text-align: center;
    position: relative;
}

div#container {
    width: 200px;
    height: 200px;
    overflow-y: scroll;
    border: 2px solid black;
    margin: auto;
}

Can you help me?

Answer 1

Simply add another wrapping container and add position: relative to the main one. Please see my Working fiddle here .