Block Scrolling of one particular item in ScrollViewer - xaml

Question

I have one static page displaying result of an event as given below.
<StackPanel Height="3700" >
<ScrollViewer Margin="10" HorizontalScrollBarVisibility="Visible" VerticalScrollBarVisibility="Visible" Height="495" >
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="50"/>
<RowDefinition Height="70"/>
<RowDefinition Height="50"/>
<RowDefinition Height="50"/>
<RowDefinition Height="50"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="120"/>
<ColumnDefinition Width="120"/>
<ColumnDefinition Width="300"/>
<ColumnDefinition Width="170"/>
<ColumnDefinition Width="200"/>
</Grid.ColumnDefinitions>
<Border Grid.Row="1" Grid.ColumnSpan="5" Background="#FF3664F8"/>
<Border Grid.Row="8" Grid.ColumnSpan="5" Background="#FF3664F8"/>
<Border Grid.Row="2" Grid.ColumnSpan="5">
<Image Source="../Images/Divider.png" Margin="0,30,0,0" Height="7"/>
</Border>
<Border Grid.Row="3" Grid.ColumnSpan="5">
<Image Source="../Images/Divider.png" Margin="0,30,0,0" Height="7"/>
</Border>
<Border Grid.Row="4" Grid.ColumnSpan="5">
<Image Source="../Images/Divider.png" Margin="0,30,0,0" Height="7"/>
</Border>
<TextBlock Text="column1" Grid.Row="1" Grid.Column="0" TextWrapping="Wrap" FontSize="24" Padding="5" FontWeight="SemiBold"/>
<TextBlock Text="column2" Grid.Row="1" Grid.Column="1" FontSize="24" Padding="5" FontWeight="SemiBold" TextWrapping="Wrap"/>
<TextBlock Text="column3" Grid.Row="1" Grid.Column="2" FontSize="24" Padding="5" FontWeight="SemiBold" TextWrapping="Wrap"/>
<TextBlock Text="column4" Grid.Row="1" Grid.Column="3" FontSize="24" Padding="5" FontWeight="SemiBold" TextWrapping="Wrap"/>
<TextBlock Text="column5" Grid.Row="1" Grid.Column="4" FontSize="24" Padding="5" FontWeight="SemiBold" TextWrapping="Wrap"/>
<TextBlock Text="1" Grid.Row="2" Grid.Column="0" Padding="10" FontSize="20"/>
<TextBlock Text="3269" Grid.Row="2" Grid.Column="1" Padding="10"/>
<TextBlock Text="SINGH SURENDER" Grid.Row="2" Grid.Column="2" TextWrapping="Wrap" Padding="5"/>
<TextBlock Text="IND" Grid.Row="2" Grid.Column="3" Padding="5"/>
<TextBlock Text="1:05:44" Grid.Row="2" Grid.Column="4" Padding="5"/>
<TextBlock Text="2" Grid.Row="3" Grid.Column="0" Padding="10" FontSize="20"/>
<TextBlock Text="12784" Grid.Row="3" Grid.Column="1" Padding="10"/>
<TextBlock Text="UTRAINEN JUTSI" Grid.Row="3" Grid.Column="2" Padding="5"/>
<TextBlock Text="FIN" Grid.Row="3" Grid.Column="3" Padding="5"/>
<TextBlock Text="1:05:57" Grid.Row="3" Grid.Column="4" Padding="5"/>
<TextBlock Text="3" Grid.Row="4" Grid.Column="0" Padding="10" FontSize="20"/>
<TextBlock Text="3202" Grid.Row="4" Grid.Column="1" Padding="10"/>
<TextBlock Text="KUMAR SANTOSH" Grid.Row="4" Grid.Column="2" Padding="5"/>
<TextBlock Text="IND" Grid.Row="4" Grid.Column="3" Padding="5"/>
<TextBlock Text="1:06:17" Grid.Row="4" Grid.Column="4" Padding="5"/>
</Grid>
</ScrollViewer>
</StackPanel>
After every result there is an divider line for which I have used an image (Divider.png). We have 5 columns to display so used horizontal scroll viewer to display.
The problem is : My designer wants that , when we scroll horizontally the data should move but the divider line shound not move.
Is it possible somehow??

Answer 1

I'm not sure what is actually wanted as my understanding of the requirements doesn't make sense. If the dividers don't move but the content does then you could end up with the content overlapping the separator.
That said, if you want to stop something from scrolling just take it out of the scrollviewer. If you put the dividers behind the scrollviewer, then as long as you have a transparent background to the scrollviewer content you'll get the effect you're after.