views:

282

answers:

1

Hi, I am subclassing a control from TabControl (to be able to add stuff alongside tabs, like modern browsers do), and I encountered this problem:

The active tab of native TabControl (1st and 2nd control from the top in the picture) overlaps the border of ContentPresenter, hiding the thin line underneath.

I copied the xaml from Aero dictionary (aero.normalcolor.xaml) and added my extra content slots, however, I cannot get active tab to overlap (the ones with arrows). This is also consistent with my knowledge that control cannot 'leave' it's designated space (in other words, we don't have position: relative; in wpf - the first tabcontrol looks like it had this css: tab:active { position: relative; top: 1px; }).

tab problems

So, my question is: how did Microsoft devs do this, and how can I replicate the overlapped look? Thanks!

A: 

Hmm, it seems that they are doing it by setting ZIndex to 1 and moving the tab by means of setting negative margins - which is OK in containers that support ZIndex and negative margins: Canvas and Grid

Tomáš Kafka