My WPF UserControl must never get wider than the containing ButtonBar - wpf

Question

I have bound at top the Width of the UserControl to the Width of the ButtonGrid at top.
It does not work. I want my UserControl always that wide as the width of the ButtonGrid. The problem is loading documents with a long name > Sum(Width of 3 buttons) makes the UserControl as wide as the document name. Now imagine having document names with 100 chars or longer and you add documents the UserContol will bump and jump...
<UserControl x:Class="TBM.View.DocumentListView"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:Behaviours="clr-namespace:FunctionalFun.UI.Behaviours"
xmlns:Helper="clr-namespace:TBM.Helper"
mc:Ignorable="d"
d:DesignHeight="300"
d:DesignWidth="300"
Width="{Binding ElementName=ButtonGrid,Path=Width}"
>
<UserControl.Resources>
<Helper:BooleanToVisibilityConverter x:Key="boolToVisibilityConverter" />
</UserControl.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<ListBox
SelectionMode="Extended"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
Behaviours:MultiSelectorBehaviours.SynchronizedSelectedItems="{Binding SelectedDocumentViewModelList,Mode=TwoWay}"
Width="Auto"
Focusable="True"
ScrollViewer.HorizontalScrollBarVisibility="Auto"
ScrollViewer.VerticalScrollBarVisibility="Auto"
Grid.Row="0"
HorizontalAlignment="Stretch"
VerticalAlignment="Stretch"
Name="documentListBox"
BorderThickness="1"
ItemsSource="{Binding DocumentList}"
Visibility="{Binding ElementName=documentListBox,Path=HasItems, Converter={StaticResource boolToVisibilityConverter}}"
>
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<!--<TextBlock Text="{Binding Path=Id}" />-->
<TextBlock Text="{Binding Path=DocumentName}" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<UniformGrid x:Name="ButtonGrid"
Grid.Row="1"
Rows="1"
HorizontalAlignment="Stretch"
VerticalAlignment="Bottom"
>
<Button Command="{Binding Path=DeleteDocumentCommand}" HorizontalAlignment="Stretch" Content="Delete" />
<Button Command="{Binding Path=AddDocumentCommand}" HorizontalAlignment="Stretch" Content="Add" />
<Button Command="{Binding Path=OpenDocumentCommand}" HorizontalAlignment="Stretch" Content="Open" />
</UniformGrid>
</Grid>
</UserControl>

Answer 1

You could also set the width of the ParentGrid(containing the control) to a fixed size, en then horizontal alignment to Stretch

Answer 2

Try 2 stuff
Use horizontal alignment on user control to stretch
Set binding to MaxWidth same as Width binding