Question

In a listbox, when I select an item I still get some kind of border or space around my listboxitem creating the line you see in the image. I want to remove that line I put a circle around.

It already has HorizontalContentAlignment = "Stretch" by the way.

What am I doing wrong?

The problem:

Answer 1

Matt’s right, in that it’s sort of a bug. The padding is hard coded in the ListBox template, rather than being tied to a property you can change.

Best way to fix this is to redefine the template, like so:

<ListBox>     <ListBox.Template>         <ControlTemplate TargetType='{x:Type ListBox}'>             <Border                  SnapsToDevicePixels='true'                  x:Name='Bd'                  Background='{TemplateBinding Background}'                  BorderBrush='{TemplateBinding BorderBrush}'                  BorderThickness='{TemplateBinding BorderThickness}'                  Padding='0'> <!-- This was originally 1 -->                 <ScrollViewer                      Focusable='false'                      Padding='{TemplateBinding Padding}'>                     <ItemsPresenter SnapsToDevicePixels='{TemplateBinding SnapsToDevicePixels}'/>                 </ScrollViewer>             </Border>             <ControlTemplate.Triggers>                 <Trigger Property='IsEnabled' Value='false'>                     <Setter                          Property='Background'                          TargetName='Bd'                          Value='{DynamicResource {x:Static SystemColors.ControlBrushKey}}'/>                 </Trigger>                 <Trigger Property='IsGrouping' Value='true'>                     <Setter                          Property='ScrollViewer.CanContentScroll'                          Value='false'/>                 </Trigger>             </ControlTemplate.Triggers>         </ControlTemplate>     </ListBox.Template>      <ListBoxItem>Item1</ListBoxItem>     <ListBoxItem>Item2</ListBoxItem>     <ListBoxItem>Item3</ListBoxItem> </ListBox>