c# - WPF Difference Between Design View and Running -

in design view have this:

but when run, this:

this code:

<viewbox margin="95,49,399.4,246.4">     <grid width="20" height="20">         <ellipse stroke="black" horizontalalignment="left" width="20"/>         <textblock horizontalalignment="center" text="i" textalignment="center" verticalalignment="center"/>     </grid> </viewbox> <viewbox margin="21,43,21,243.4">     <grid height="20">         <textblock fontsize="8" horizontalalignment="center" text="lorem ipsum dolor sit amet consecutetur" textalignment="left" verticalalignment="center"/>     </grid> </viewbox> 

is there better way me achieve in design view; and, why there difference @ between two?

i'm pretty sure because window different size @ runtime, although that's not real issue.

you using 2 different viewboxes , each secured place using margin different offsets each window edge. if make window bigger or smaller margins don't change, size inside viewbox does.

since viewbox automatically scale contents fit size of available area (see http://msdn.microsoft.com/en-us/library/system.windows.controls.viewbox.aspx) makes content different.

if trying layout above, i'd lays out horizontally , centres;

 <stackpanel >         <textblock fontsize="20" text="heading" horizontalalignment="center"/>         <stackpanel orientation="horizontal"  horizontalalignment="center">             <grid x:name="igrid">                 <ellipse width="{binding elementname=igrid, path=actualheight}" stroke="black"/>                 <textblock text="i" horizontalalignment="center" verticalalignment="center"/>             </grid>             <textblock text="lorem ipsum"/>         </stackpanel>     </stackpanel>