Odd width problem on TitlebarTemplate

[Mike]

Hi there,

I have two RadDocks in two separate table cells, both with TitlebarTemplates; they are using Telerik's "out of the box" styling, with .png faded backgrounds.

I've encountered an issue whereupon resizing the browser window from high width (~1920px) down to about ~800px causes the three cells of the table row to "break" and the height of the table row increases, and the background fade is no longer applied neatly.

I have traced the problem to the em tag that encapsulates the title: it has a style set, in my case, width="850px". This means that when the browser is resized, the width is kept and the "break" occurs. If you refresh the page (at the smaller browser window width), the TitlebarTemplate is redrawn correctly (e.g. the background fade is displayed correctly), which leads me to believe that some JS is used (at least on load) to calculate the width. However, the same JS does not work on resizing the width to a smaller value.

I am unable (I think) to style this via CSS as the style is applied to the element itself, e.g. the deepest element in the HTML doc. I've tried the override keyword with no success.

Does a workaround exist for this?

Thank you,

Mike K.

[Pero]

Hi Mike,

The following CSS will help you avoid the problem that occurs after resizing the browser:

<style type="text/css">
    .rdCommands, .RadDockZone .rdCommands
    {
        position: absolute !important;
        right: 7px;
    }
    .rdCommands
    {
        right: 3px;
    }
</style>

Regards,
Pero
the Telerik team

[Mike]

That's great, thanks very much :-)