Search code examples
jquerycssdraggablejsfiddle

Jquery draggable doesn't reach edges of container


I'm very happy with my code at this JSfiddle, but for some reason I can't fathom, the triangles won't reach the top or right edges of their container. I'd be very grateful if someone could take a look and explain why.

#sandpit{
    /* display: inline-block; */
    position: relative;
    margin:20px auto;
    width: 600px;
    height: 400px;
    border: 4px solid #7b6eb1;
    border-radius: 5px;
    /* background-color: #FFC469; */
    background-color: #FFFCCF;
    padding: 2px;
}

.draggable{
    margin: 0;
    width:25px;
    height:25px;
}

Solution

  • Change your css for newTriangle to:

    .newTriangle{
      position:absolute;
      right:0;
    }