I seem to be having a weird problem when using border-radius and overflow: hidden together, please see the picture for my problem. As you can see in the bottom right the image doesn't expand to the very edge of the div and a little curve is visible, any help will be much appreciated.
border is not a equal control to frame, there is not corner radius. but, IsClippedToBounds="True" is the solution. Not related with the issue, which we must fix but you can use any Shape with the Border, included a RoundRectangle where you can set the radius from any corner.the issue is with the pseudo-elements. you cant set a border-radius there as f.e. the bottom line has a height of 2px and a width of 100%. you can't set a border-radius here / it is not doing the thing you want. i've seen similar things with an svg, that is animated -> drawing the ring. – xhhvuS.