Extra Pixel Between TabBar and ViewStack

Question

I have a  TabBar inside an HBox, becuase I want to disply  other things to the left and right of  the TabBar.  I'm stacking the HBox  over a ViewStack buy putting  both in a  VBox, and setting the VBox "verticalGap"  to  "0".  It almost works as expected, but I get an extra pixel of "HBox" showing through between the TabBar and the ViewStack.  I've tried setting borders and padding to 0, but to no avail.
Any  help  on how to get  rid of  the extra pixel, or info on where it's even coming from, would be much apprerciated.
The folloing tiny application demonstrates the problem  (I know it's  ugly;   it's supposed to be so that it clearly  demonstrates  the problem):
<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute">
    <mx:Style>
        TabBar.testTabBarStyle{backgroundColor: #FFCC00; tabStyleName: tabBarTab;}
        .tabBarTab{fillColors: #FF0000, #0000FF;}
    </mx:Style>
    <mx:VBox x="10" y="10" width="343" height="200" verticalGap="0" backgroundColor="#FF0096">
        <mx:HBox width="100%">
            <mx:Label text="Stuff Above TabBar/ViewStack Control"/>
        </mx:HBox>
        <mx:HBox width="100%" backgroundColor="#00FF00" borderThickness="0" paddingBottom="0">
            <mx:Label text="Stuff Left"/>
            <mx:TabBar width="75%" dataProvider="viewstack1" styleName="testTabBarStyle" paddingBottom="0"/>
            <mx:Label text="Stuff Right"/>
        </mx:HBox>
        <mx:ViewStack id="viewstack1" width="100%" height="80%" backgroundColor="#FFCC00">
            <mx:Canvas label="Tab1" width="100%" height="100%">
                <mx:Label text="Veiw1 - Annoying green pixel above --^"/>
            </mx:Canvas>
            <mx:Canvas label="Tab2" width="100%" height="100%">
                <mx:Label text="Veiw2 - Annoying green pixel above --^"/>
            </mx:Canvas>
            <mx:Canvas label="Tab3" width="100%" height="100%">
                <mx:Label text="Veiw3 - Annoying green pixel above --^"/>
            </mx:Canvas>
        </mx:ViewStack>
        <mx:HBox width="100%">
            <mx:Label text="Stuff Below  TabBar/ViewStack Control"/>
        </mx:HBox>
    </mx:VBox>
</mx:Application>

Answer 1

Hi Aman,
I don't think that will resolve the issue and also for the bottom we need to specify an integer which is in pixels we should not specify string ..none.
The issue will be resolved simply by setting the VBox vertigalGap to negative value...vertigalGap="-2"
Thanks,
Bhasker