wpf elements with a vertical alignment of top aren't exactly at the top and have a weird gap.

Rules of WPF:

❌ Avoid the WPF Designer to eliminate a category of confusing bugs
❌ Don't rely on Margin as the primary tool for layouts
❌ Avoid writing UserControls or subclassing to extend a default control -- use Behaviors instead (Microsoft.Xaml.Behaviors.Wpf)

✅ Write XAML by hand and autoformat with "Ctrl K,D" or XAML Styler
✅ Rely upon XAML Hot Reload to design your app's UI at runtime
✅ Use layout controls (Grid, DockPanel, etc) to support proper resizing
✅ Use data binding to eliminate glue code and state synchronization issues
✅ Use collection controls and DataTemplate to dynamically create lists of controls
✅ Learn MVVM to create maintainable apps
✅ Use the Dispatcher to update controls from non-UI threads
✅ WPF's default controls can be easily modernized via $wpfuilibs
✅ Include relevant XAML, code-behind, and ViewModel code for questions when possible

Rules of WPF:

❌ Avoid the WPF Designer to eliminate a category of confusing bugs
❌ Don't rely on Margin as the primary tool for layouts
❌ Avoid writing UserControls or subclassing to extend a default control -- use Behaviors instead (Microsoft.Xaml.Behaviors.Wpf)

✅ Write XAML by hand and autoformat with "Ctrl K,D" or XAML Styler
✅ Rely upon XAML Hot Reload to design your app's UI at runtime
✅ Use layout controls (Grid, DockPanel, etc) to support proper resizing
✅ Use data binding to eliminate glue code and state synchronization issues
✅ Use collection controls and DataTemplate to dynamically create lists of controls
✅ Learn MVVM to create maintainable apps
✅ Use the Dispatcher to update controls from non-UI threads
✅ WPF's default controls can be easily modernized via $wpfuilibs
✅ Include relevant XAML, code-behind, and ViewModel code for questions when possible