c# - WPF web browser Project, decreasing window size make tool bar items disappear -

<grid>     <dockpanel lastchildfill="true" >         <tabcontrol x:name="posstabcontrol" dockpanel.dock="top" height="auto" width="auto" verticalalignment="stretch" horizontalalignment="stretch" >             <tabitem header="tab page 1" margin="-9,-2,0,-2">                 <webbrowser name="webbrowser1" margin="0,36,0,0"></webbrowser>             </tabitem>             <tabitem rendertransformorigin="0.094,0.5" margin="-2,-2,2,-2" height="25">                 <tabitem.headertemplate>                     <datatemplate>                         <stackpanel orientation="horizontal">                             <image source="images/add.ico" width="19" height="15"></image>                         </stackpanel>                     </datatemplate>                 </tabitem.headertemplate>             </tabitem>         </tabcontrol>     </dockpanel>     <dockpanel lastchildfill="true">         <toolbar margin="0,28,0,342" dockpanel.dock="top" verticalalignment="top" height="40" width="auto">             <stackpanel orientation="horizontal">                 <button x:name="btnback" height="30" margin="0,-2,0,-3" width="30" foreground="#fff02525">                     <button.content>                         <image source="images/back.ico" stretch="fill">                         </image>                     </button.content>                 </button>                 <button x:name="btnfoward" width="30" height="30" margin="2.5,-1,0,-2">                     <button.content>                         <image source="images/forward.ico" stretch="fill">                         </image>                     </button.content>                 </button>                 <button x:name="btnhome" width="30" height="30" margin="2.5,-1,0,-2">                     <button.content>                         <image source="images/home.ico" stretch="fill">                         </image>                     </button.content>                 </button>                 <progressbar x:name="socialprogress" margin="2.9,-1,0,-2" width="546" height="30"></progressbar>                 <button x:name="btngo" width="40" margin="5,-1,0,-2" content="go" click="btngo_click">                  </button>                 <combobox x:name="searchcombo" margin="0,3,-5,2" width="51" selectedindex="0">                     <comboboxitem>                         <stackpanel orientation="horizontal">                             <image source="images/google.ico" height="25" width="25"></image>                         </stackpanel>                     </comboboxitem>                     <comboboxitem>                         <stackpanel>                             <image source="images/yahoo.ico" height="25" width="25"></image>                         </stackpanel>                     </comboboxitem>                     <comboboxitem>                         <stackpanel>                             <image source="images/bing.ico" height="25" width="25"></image>                         </stackpanel>                     </comboboxitem>                     <comboboxitem>                         <stackpanel>                             <image source="images/amazon.ico" height="25" width="25"></image>                         </stackpanel>                     </comboboxitem>                     <comboboxitem>                         <stackpanel>                             <image source="images/ebay.ico" height="25" width="25"></image>                         </stackpanel>                     </comboboxitem>                     <comboboxitem>                         <stackpanel>                             <image source="images/twitter.ico" height="25" width="25"></image>                         </stackpanel>                     </comboboxitem>                     <comboboxitem>                         <stackpanel>                             <image source="images/wikipedia.ico" height="25" width="25"></image>                         </stackpanel>                     </comboboxitem>                 </combobox>                 <textbox margin="5,3,5,2" name="searchbar" width="290"/>                 <image source="images/magnifying.png" width="30" height="30"></image>                 <button width="94" height="30"></button>             </stackpanel>         </toolbar>     </dockpanel>     <dockpanel lastchildfill="true">         <stackpanel orientation="horizontal">             <textbox x:name="addressbar" height="31" margin="107,33,590,0" verticalalignment="top" background="transparent" fontsize="20" width="548"/>         </stackpanel>     </dockpanel>      <dockpanel lastchildfill="true">         <stackpanel orientation="horizontal" horizontalalignment="right" dockpanel.dock="top">             <button x:name="btnminimize" horizontalalignment="left" margin="858,0,0,0" verticalalignment="top" width="28" height="27" click="btnminimize_click">                 <button.content>                     <image source="images/minimize.ico" stretch="fill">                     </image>                 </button.content>             </button>             <button x:name="btnmaximize" horizontalalignment="left" margin="4,0,0,0" verticalalignment="top" width="28" height="27" click="btnmaximize_click">                 <button.content>                     <image source="images/maximize.png" stretch="fill">                     </image>                 </button.content>             </button>             <button x:name="btnclose" horizontalalignment="left" margin="4,0,0,0" verticalalignment="top" width="28" height="27" click="btnclose_click">                 <button.content>                     <image source="images/close.ico" stretch="fill">                     </image>                 </button.content>             </button>         </stackpanel>     </dockpanel> </grid> 

my wpf web browser project .. while decreasing window size,tool bar items disappear when border touches last button in toolbar,any solving problem appreciated [please note first wpf project .. have limited knowledge in subject

firs of recommend avoid setting static height , width controls, better use grid container control place controls. , many of problem regarding arranging control solved automatically. paste xaml in editor , check how grid can used place controls

<grid>     <grid.rowdefinitions>         <rowdefinition height="auto"></rowdefinition>         <rowdefinition height="auto"></rowdefinition>         <rowdefinition height="auto"></rowdefinition>         <rowdefinition></rowdefinition>     </grid.rowdefinitions>      <stackpanel orientation="horizontal" grid.row="0" horizontalalignment="right">         <button x:name="btnminimize" horizontalalignment="left" width="28" height="27" >             <button.content>                 <image source="images/minimize.ico" stretch="fill">                 </image>             </button.content>         </button>         <button x:name="btnmaximize" horizontalalignment="left" margin="4,0,0,0" width="28" height="27">             <button.content>                 <image source="images/maximize.png" stretch="fill">                 </image>             </button.content>         </button>         <button x:name="btnclose" horizontalalignment="left" margin="4,0,0,0" width="28" height="27" >             <button.content>                 <image source="images/close.ico" stretch="fill">                 </image>             </button.content>         </button>     </stackpanel>      <textbox x:name="addressbar" background="transparent" fontsize="20" grid.row="1"/>      <toolbar grid.row="2" height="40">         <stackpanel orientation="horizontal">             <button x:name="btnback" height="30" margin="0,-2,0,-3" width="30" foreground="#fff02525">                 <button.content>                     <image source="images/back.ico" stretch="fill">                     </image>                 </button.content>             </button>             <button x:name="btnfoward" width="30" height="30" margin="2.5,-1,0,-2">                 <button.content>                     <image source="images/forward.ico" stretch="fill">                     </image>                 </button.content>             </button>             <button x:name="btnhome" width="30" height="30" margin="2.5,-1,0,-2">                 <button.content>                     <image source="images/home.ico" stretch="fill">                     </image>                 </button.content>             </button>             <progressbar x:name="socialprogress" margin="2.9,-1,0,-2" width="546" height="30"></progressbar>             <button x:name="btngo" width="40" margin="5,-1,0,-2" content="go">              </button>             <combobox x:name="searchcombo" margin="0,3,-5,2" width="51" selectedindex="0">                 <comboboxitem>                     <stackpanel orientation="horizontal">                         <image source="images/google.ico" height="25" width="25"></image>                     </stackpanel>                 </comboboxitem>                 <comboboxitem>                     <stackpanel>                         <image source="images/yahoo.ico" height="25" width="25"></image>                     </stackpanel>                 </comboboxitem>                 <comboboxitem>                     <stackpanel>                         <image source="images/bing.ico" height="25" width="25"></image>                     </stackpanel>                 </comboboxitem>                 <comboboxitem>                     <stackpanel>                         <image source="images/amazon.ico" height="25" width="25"></image>                     </stackpanel>                 </comboboxitem>                 <comboboxitem>                     <stackpanel>                         <image source="images/ebay.ico" height="25" width="25"></image>                     </stackpanel>                 </comboboxitem>                 <comboboxitem>                     <stackpanel>                         <image source="images/twitter.ico" height="25" width="25"></image>                     </stackpanel>                 </comboboxitem>                 <comboboxitem>                     <stackpanel>                         <image source="images/wikipedia.ico" height="25" width="25"></image>                     </stackpanel>                 </comboboxitem>             </combobox>             <textbox margin="5,3,5,2" name="searchbar" width="290"/>             <image source="images/magnifying.png" width="30" height="30"></image>             <button width="94" height="30"></button>         </stackpanel>     </toolbar>      <tabcontrol x:name="posstabcontrol" grid.row="3">         <tabitem header="tab page 1" >             <webbrowser name="webbrowser1" ></webbrowser>         </tabitem>         <tabitem >             <tabitem.headertemplate>                 <datatemplate>                     <image source="images/add.ico" width="19" height="15"></image>                 </datatemplate>             </tabitem.headertemplate>         </tabitem>     </tabcontrol>    </grid>