# ComboBox: a Foreground issue

> Yesterday, while I was updating my apps, I realized that the Foreground property was behaving rather strangely on the ComboBox. The SelectedItem no longer had the…

- Author: Jérôme Giacomini
- Language: en
- Canonical URL: [ComboBox: a Foreground issue](https://jeromegiacomini.net/articles/2015/06/16/combobox-a-foreground-issue)
- Published: 2015-06-16
- Last modified: 2026-09-05
- Topics: .NET

Yesterday, while I was updating my apps, I realized that the Foreground property was behaving rather strangely on the ComboBox.

The SelectedItem no longer had the Foreground applied when the comboBox had more than six entries!

Here 's my code:

```

  <StackPanel Background="Pink"
                Orientation="Vertical">

        <ComboBox x:Name="cb"
                  Margin="4"
                  SelectedIndex="0"
                  Foreground="Blue">
            <ComboBoxItem>aa</ComboBoxItem>
            <ComboBoxItem>bb</ComboBoxItem>
            <ComboBoxItem>cc</ComboBoxItem>
            <ComboBoxItem>dd</ComboBoxItem>
            <ComboBoxItem>ee</ComboBoxItem>
        </ComboBox>


        <ComboBox x:Name="cb1"
                  Margin="4"
                  SelectedIndex="0"
                  Foreground="Blue">
            <ComboBoxItem>aa</ComboBoxItem>
            <ComboBoxItem>bb</ComboBoxItem>
            <ComboBoxItem>cc</ComboBoxItem>
            <ComboBoxItem>dd</ComboBoxItem>
            <ComboBoxItem>ee</ComboBoxItem>
            <ComboBoxItem>ff</ComboBoxItem>
        </ComboBox>
    </StackPanel>

```


And the result:

![Combo](https://jeromegiacomini.net/Blog/wp-content/uploads/2015/06/Combo.png)

## Why is the rendering different from 6 items?

It happens that when you have few items, when you open the combo, it's not in full screen.

![ComboFirstRendered](https://jeromegiacomini.net/Blog/wp-content/uploads/2015/06/ComboPremierRendu.png)

However, from 6, the combo goes full screen and therefore uses another template to display its selected Item.

![ComboSecondRendered](https://jeromegiacomini.net/Blog/wp-content/uploads/2015/06/ComboSecondRendu.png)

## What is the solution?

Just change the ComboBox style to apply the Foreground to the FlyoutButton.

```

<Button x:Name="FlyoutButton"       
        Foreground="{TemplateBinding Foreground}"
        Padding="6.5,0,0,0" Grid.Row="1">

```


You can download the demo project with the bug and how to fix it [here](https://jeromegiacomini.net/Blog/wp-content/uploads/2015/06/ComboBoxApp.rar).