title: Creating a Flex Panel header with a gradient
body: <p>I need a white box (I'm using a Panel because I'm so close, but it could be anything) with all four corners rounded, and the top portion of the box needs to have a gradient that starts out one color (let's say Grey) and ends up as the background color (white). The gradient does not go down the entire box.</p>
  
  <p>The top two corners must remain rounded, so the gradient must fill those rounded regions too.</p>
  
  <p>What I have so far is an mx:Panel with the following styles:</p>
  
  <pre>
  Panel {
     borderColor: #ffffff;
     borderAlpha: 1;
     borderThickness: 13;
     borderThicknessLeft: 0;
     borderThicknessTop: 0;
     borderThicknessBottom: 11;
     borderThicknessRight: 0;
     roundedBottomCorners: true;
     cornerRadius: 16;
     headerHeight: 50;
     backgroundAlpha: 1;
     highlightAlphas: 0.29, 0;
     headerColors: #999999, #ffffff;
     backgroundColor: #ffffff;
     dropShadowEnabled: false;
  }
  </pre>
  
  <p>As you can see, there is one tiny single-pixel line that cuts across the header. If I can just get rid of that single-pixel line, that would be perfect! I have tried changing the borderStyle property to "solid" and still cannot get the right combination of styles to get rid of that line. </p>
  
  <p>I have also tried using another container with a background image for the gradient, but the rounded corners become an issue. </p>
  
  <p>Any help would be greatly appreciated!</p>