How to make the contents of a round-cornered border be also round-cornered?

Question

I have a border element with rounded corners containing a 3x3 grid. The corners of the grid are sticking out of the border. How can I fix that? I tried using ClipToBounds bu

Answer 1

Pure XAML:

Update: Found a better way to achieve the same result. You can also replace Border with any other element now.