Resize Columns of Styled WPF DataGrid

Question

I have DataGrid with custom style, I'm having trouble in re-sizing columns because it only works when the cursor is EXACTLY between the two columns

Here's the part of style that sets the DataGridColumnHeader

    <Style TargetType="{x:Type DataGridColumnHeader}">
    <Setter Property="VerticalContentAlignment" Value="Center"/>
    <Setter Property="HorizontalContentAlignment" Value="Center"/>
    <Setter Property="Foreground" Value="White"/>
    <Setter Property="FontFamily" Value="Segoue UI"/>
    <Setter Property="FontSize" Value="14"/>
    <Setter Property="Height" Value="40"/>

    <Setter Property="Template">

        <Setter.Value>
            <ControlTemplate TargetType="{x:Type DataGridColumnHeader}">
                <Grid>
                    <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="#6b6b6b">
                        <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                    </Border>

                    <Thumb x:Name="PART_RightHeaderGripper" HorizontalAlignment="Right" Style="{StaticResource ColumnHeaderGripperStyle}"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

Answer 1

increase the Thumb's Width like this :

 <Thumb x:Name="PART_RightHeaderGripper" Width="100" HorizontalAlignment="Right" Style="{StaticResource ColumnHeaderGripperStyle}"/>