Border Styling applied to all the child elements recursively

Question

I am new to WPF and need your help in resolving my styling issue.

I have applied border styling to GRID as below

<Border CornerRadius="5" BorderBrush="Gainsboro" BorderThickness="1,1,0,0" Name="border1" Margin="90,54,20,50" >
                    <Border BorderBrush="Gray" CornerRadius="5" BorderThickness="0,0,1,1" >
                        <Border.Effect>
                            <DropShadowEffect BlurRadius="10" Direction="-50" ShadowDepth="7" />
                        </Border.Effect>
                        <Border.Child>
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto"/>
                                    <RowDefinition Height="356*" />
                                </Grid.RowDefinitions>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto" />
                                    <ColumnDefinition Width="446*" />
                                </Grid.ColumnDefinitions>

                                <TextBox Name="TB1" Style="{StaticResource CustomTextBoxStyle}" Grid.Column="1" Margin="46,79,400,277" Grid.Row="1" />
                                <ComboBox Height="24" Name="comboBox1" Width="110" Grid.Column="1" Margin="304,86,232,276" Grid.Row="1" />

                            </Grid>
                        </Border.Child>


                    </Border>                    
                </Border>

Then I have placed text box and combo box in the grid with custom styling.

The problem is parent GRID's border style is applied to child TEXTBOX along with its own custom style properties.

Could you please help me out in this?

Thanks Bharat

score 1 · Accepted Answer · answered Mar 01 '13 at 18:47

As per MSDN doucment -

When a BitmapEffect is applied to a layout container, such as DockPanel or Canvas, the effect is applied to the visual tree of the element or visual, including all of its child elements.

But, there is a workaround as described here and here to have another border with same position but without the effect, that would resolve the problem -

<Grid>
  <Border Margin="10" BorderBrush="Red" BorderThickness="1">
   <Border.Effect>
    <DropShadowEffect Color="Gray"/>
   </Border.Effect>
  </Border>
  <Border Margin="10">
   <!-- controls -->
  </Border>
 </Grid>

Border Styling applied to all the child elements recursively

1 Answers1