c# - Properly sizing a WPF control to always stay the same size as its parent -

i trying create grid of buttons simple wpf calculator application i'm having trouble drawing buttons properly.

i using grid (grdplusminus) inside button (btnplusminus) - within overall controls grid (grdcontrols) - can make elliptical button simple label on top of it. ellipse should fill visible portion of button.

when using code below, bottom , right-hand sides of ellipse "cut off" no matter how window resized. ellipse in proportion never displayed fully. when reset width , height of grdplusminus auto (via vs ui, not in code) both set 1 result grdplusminus - , therefore in - shrinks single pixel.

i'm doing stupid @ basic level can't think is. i've tried different kinds of bindings , settings - e.g. binding width instead of actualwidth, etc. - cannot figure out i'm doing wrong. thought might because of margins removing margin altogether doesn't change problem much.

can point out must doing wrong please? (i tried variation of xaml in kaxaml , got same problem.)

if there better way of doing - overall - i'm trying i'd hear i'd know what's wrong before try else. (my eventual intention have height , width of each button set smallest dimension of button displayed circle in centre of button that's later, unless information allows better solution.)

<window x:class="calc.mainwindow"         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"         xmlns:d="http://schemas.microsoft.com/expression/blend/2008"         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"         xmlns:local="clr-namespace:calc"         mc:ignorable="d"         title="mainwindow" height="651.5" width="525" windowstartuplocation="centerscreen">     <grid x:name="grdcontrols">         <grid.rowdefinitions>             <rowdefinition/>             <rowdefinition/>             <rowdefinition/>             <rowdefinition/>             <rowdefinition/>             <rowdefinition/>         </grid.rowdefinitions>         <grid.columndefinitions>             <columndefinition/>             <columndefinition/>             <columndefinition/>             <columndefinition/>         </grid.columndefinitions>         <button x:name="btnplusminus" grid.row="5" background="{x:null}" borderbrush="{x:null}" foreground="{x:null}" margin="4">             <grid x:name="grdplusminus" width="{binding actualwidth, elementname=btnplusminus, mode=oneway}" height="{binding actualheight, elementname=btnplusminus, mode=oneway}">                 <ellipse x:name="ellipse" stroke="#ff39a8dc" fill="#ffa0d2e2"/>                 <label x:name="label" content="xxx" horizontalalignment="center" verticalalignment="center" verticalcontentalignment="center" foreground="#ff0a263a" horizontalcontentalignment="center"/>             </grid>         </button>      </grid> </window> 

well asking why umbrella doesn't work when jump off airplane. simple answer problem not intended used way. xaml has 1 of best positioning systems ever using easy(performance might not should not worry it).

 <grid>         <grid.rowdefinitions>             <!-- doing multiple rows not needed can use relative size work adding values in rows (1+5) , deviding them             5* 5/6 of parant              , 1* 1/6 of parent height             -->             <rowdefinition height="5*"/>             <rowdefinition height="1*"/>         </grid.rowdefinitions>         <grid.columndefinitions>             <!-- works same columns -->             <columndefinition width="1*"/>             <columndefinition width="4*"/>         </grid.columndefinitions>         <button grid.row="1">             <button.style>                 <!-- template button use it's best use global styles can inline well-->                 <style targettype="button">                     <setter property="template" >                         <setter.value>                             <controltemplate targettype="button">                                 <grid>                                     <ellipse stroke="#ff39a8dc" fill="#ffa0d2e2"/>                                     <!-- used show ever in inner button content can image or textblock or -->                                     <contentpresenter                                          content="{templatebinding content}"                                          horizontalalignment="{templatebinding horizontalcontentalignment}"                                          verticalalignment="{templatebinding verticalcontentalignment}" />                                  </grid>                             </controltemplate>                         </setter.value>                     </setter>                 </style>             </button.style>             <label content="xxx"></label>         </button>     </grid> 

here more on how grid works.