If I set a border radius and a border for the thumbnail in a listview, it seems to treat the border as part of the picture like this:

![enter image description here](https://i.stack.imgur.com/RkUig.png)

The CSS override rule I'm using is this:

```
.ui-li-thumb {
    width: 50px;
    height: 50px;
    margin: 8px;
    border: 2px solid #333 !important;
    border-radius: 10px !important;
}

```

How do I make it so the image has the border-radius too, so it doesn't overlap its border?