Hi,

How can I change the height of caption bar?

I am using rendering mode html5 and following skin settings:

<WindowSettings ContentMode="UseIFrame" ControlBox="No" enablefastwindowactivation="True" iframeallowtransparency="False" ignoreiframepadding="True" BorderType="ComplexImages" CommandButtonBorderType="ComplexImages"> <WindowStyle> <Active CssClass="dskWndAct" />
 <Normal CssClass="dskWndNrml" />
 </WindowStyle>
 <CaptionStyle>
 <Active CssClass="dskCptAct" />
 <Normal CssClass="dskCptNrml" />
 </CaptionStyle>
 <CaptionButtonStyle>
 <Active CssClass="dskCptButAct" />
 <Over CssClass="dskCptButOvr" />
 <Normal CssClass="dskCptButNrml" />
 </CaptionButtonStyle>
 <CommandButtonStyle>
 <Normal CssClass="dskCmdButNrml" />
 <Over CssClass="dskCmdButOvr" />
 <Active CssClass="dskCmdButAct" />
 </CommandButtonStyle>
 <CommandButtonDisabledStyle CssClass="dskCmdButDis" />
 <ContainerStyle CssClass="dskContainer" />
 </WindowSettings>

<ImagesSettings CaptionRightInactive="o7/right_inactive.gif" CaptionLeftInactive="o7/left_inactive.gif" CloseOver="o7/close_over.gif" ButtonCenterOver="o7/button_center_over.gif" ButtonLeftActive="o7/button_left_active.gif" ButtonRightActive="o7/button_right_active.gif" MaximizeActive="o7/max_active.gif" RestoreOver="o7/restore_over.gif" CaptionRightActive="o7/right_active.gif" CloseActive="o7/close_active.gif" ButtonLeftOver="o7/button_left_over.gif" RestoreActive="o7/restore_active.gif" MaximizeInactive="o7/max_inactive.gif" ButtonRightInactive="o7/button_right_normal.gif" RestoreInactive="o7/restore_inactive.gif" ButtonLeftInactive="o7/button_left_normal.gif" ButtonCenterInactive="o7/button_center_normal.gif" MaximizeOver="o7/max_over.gif" MinimizeInactive="o7/min_inactive.gif" CloseInactive="o7/close_inactive.gif" ButtonCenterActive="o7/button_center_active.gif" CaptionCenterInactive="o7/center_inactive.gif" MaximizeDown="o7/max_down.gif" RestoreDown="o7/restore_down.gif" MinimizeDown="o7/min_down.gif" CaptionCenterActive="o7/center_active.gif" ButtonRightOver="o7/button_right_over.gif" CaptionLeftActive="o7/left_active.gif" MinimizeOver="o7/min_over.gif" CloseDown="o7/close_down.gif" MinimizeActive="o7/min_active.gif" /> 

 and my css is as follows:

.dskWndAct
{
 border-style: solid;
 border-color: Black;
 border-top-width: 0px;
 border-left-width: 1px;
 border-right-width: 1px;
 border-bottom-width: 1px;
 height: 100%;
 background-color: White;
}

.dskWndNrml
{
 border-style: solid;
 border-top-width: 0px;
 border-left-width: 1px;
 border-right-width: 1px;
 border-bottom-width: 1px;
 border-color: Black;
 font-size: 9pt;
 font-family: Segoe UI,Tahoma;
 background-color: White;
 overflow: auto;
 border-width: 1px;
 height: 100%;
}

.dskCptAct
{
 color: #15428B;
 font-family: Segoe UI,Tahoma;
 font-weight: bold;
 font-size: 9pt;
 padding-top: 3px;
}
.dskCptNrml
{
 color: Gray;
 font-size: 10pt;
 font-family: Segoe UI,Tahoma;
 cursor: default;
 padding-top: 3px;
 padding-left: 2px;
 padding-bottom: 2px;
 padding-right: 2px;
}
.dskCptButAct
{
 border-top-color: Gray;
 border-left-color: Gray;
}
.dskCptButOvr
{
 border-bottom-color: Gray;
 border-right-color: Gray;
}
.dskCptButNrml
{
 overflow: hidden;
 position: relative;
}

 With these settings my caption buttons (minimize, maximize and close buttons) seems weird as you see in the attached image. If I change the style as follows and change the height of the div that contains centre_active.gif as a background from ie developer tools than it seems good. 

.dskWndAct
{
 border-style: solid;
 border-color: Black;
 border-top-width: 0px;
 border-left-width: 1px;
 border-right-width: 1px;
 border-bottom-width: 1px;
 height: 100%;
 background-color: White;
 top: 4px !important;
}

.dskWndNrml
{
 border-style: solid;
 border-top-width: 0px;
 border-left-width: 1px;
 border-right-width: 1px;
 border-bottom-width: 1px;
 border-color: Black;
 font-size: 9pt;
 font-family: Segoe UI,Tahoma;
 background-color: White;
 overflow: auto;
 border-width: 1px;
 height: 100%;
 top: 4px !important;
}

.dskCptAct
{
 color: #15428B;
 font-family: Segoe UI,Tahoma;
 font-weight: bold;
 font-size: 9pt;
 padding-top: 3px;
 height: 28px !important;
}
.dskCptNrml
{
 color: Gray;
 font-size: 10pt;
 font-family: Segoe UI,Tahoma;
 cursor: default;
 padding-top: 3px;
 padding-left: 2px;
 padding-bottom: 2px;
 padding-right: 2px;
 height: 28px !important;
}
.dskCptButAct
{
 border-top-color: Gray;
 border-left-color: Gray;
}
.dskCptButOvr
{
 border-bottom-color: Gray;
 border-right-color: Gray;
}
.dskCptButNrml
{
 overflow: hidden;
 position: relative;
 top: 4px;
}

--------------------

<div nowrap="" style='left: 7px; top: 0px; height: 29px;right: 7px; bottom: 0px; position: absolute; background-image: url("/Rhapsody.Web.UI.Presenter/ISRes.axd?D/o7.center_active.gif"); background-repeat: repeat-x;'>

How can I change the height of caption bar to solve my problem? Or can you suggest any other solution then changing height to solve weird view of caption bar buttons.