Do you mins sharing the setting you are using for the WebDesktop and WebGrid in order for us to replicate the issue in our environment? We will also be very grateful if you could provide us with a simple page that could replicate the issue.

Is the page using XHTML doctype or HTML doctype? If you are using XHTML doctype, if possible please try using HTML doctype and check if the issue has been resolved.

Hi Glenn,

I have attached a simple website to demonstrate the issue as requested. The website contains a webdesktop which launches a WebDesktop Window using an iFrame that contains a page which has a web tab on it. As you will see in firefox the iframe does not use up the full space of the window, so there is a gap down the bottom of the window with nothing on it. This project uses doc type html. Because I am using a Webtab in this demonstration and not WebGrid, this would suggest the issue is with the WebDesktop.

Regards,

Dermot

From my analysis of the attached sample, it seems the issue is caused by browser difference. Here is some suggestion in order to get a similar result in Firefox:

- Remove the width property in the TabItemStyle

<TabItemStyle>
    <Normal Cursor="Hand" Font-Names="segoe ui,tahoma" Font-Size="9pt" Height="100%"
        Width="100%" BackColor="White"
        BorderColor="Gray" BorderStyle="Solid" BorderWidth="1px">
        <Padding Top="2px" Left="10px" Right="10px" Bottom="0px"></Padding>
    </Normal>
    <Over BaseStyle="Normal" BackColor="WhiteSmoke" BorderColor="#3C7FB1">
    </Over>
    <Active BaseStyle="Normal" 
        BackColor="White" BorderColor="#898C95" BorderStyle="Solid" BorderWidth="1px">
    </Active>
</TabItemStyle>

- Remove the width property in the WebTab ContainerStyle

<ContainerStyle Overflow="Auto" OverflowY="Auto" OverflowX="Auto" BackColor="White"
    BorderColor="#898C95" BorderStyle="Solid" BorderWidth="1px" Height="100%" Width="100%"
    Font-Names="segoe ui,tahoma" Font-Size="9pt">
    <Padding Top="5px" Left="5px" Right="5px" Bottom="5px"></Padding>
</ContainerStyle>

- Set the WebDesktopManager CaptionButtonStyle border width to 0px  

<CaptionButtonStyle>
    <Over BaseStyle="Normal" GradientType=Vertical>
        <BorderSettings>
            <Bottom Color="Gray" />
            <Right Color="Gray" />
        </BorderSettings>
    </Over>
    <Normal BorderColor="White" BorderStyle="Solid" BorderWidth="0px" Height="17px" Overflow="Hidden"
        OverflowX="Hidden" OverflowY="Hidden" GradientType=Vertical>
    </Normal>
    <Active BaseStyle="Normal" GradientType=Vertical>
        <BorderSettings>
            <Left Color="Gray" />
            <Top Color="Gray" />
        </BorderSettings>
    </Active>
</CaptionButtonStyle>

Hi Glenn,

I made these changes but this made no difference to the issue I have. The iframe is still short by approx 100px in the example I provided. There is still a gap at the end of the WebDesktopWindow. Did these changes solve the issue for yourself? I have attached another screen shot highlighting my issue if clarity is needed. I have circled the issue in the screenshot. The iframe should take up 100% of the WebDesktopWindow.

Regards,

Dermot 

Just for some clarity, it doesnt matter what page the iframe points at in the default.aspx page, the same issue occurs. I have pointed it at random websites and the issue occurrs. Is this a bug or is there a setting I must set to make the iframe within the WebDesktopWindow take up 100% of the page in firefox.

Thanks,

Dermot

I fixed the issue highlighted with the gap appearing at the bottom of the WebDesktopWindow. This occurs when the setting AnimationStyle="VistaStyleZoom" is used in firefox. I still have the other issues of the data overlapping between the colmns.

Regards,

Dermot

The Firefox issue could be solved by adding overflow hidden to the RowStyle and AlternatingRowStyle. Here is the snippet:

<RowStyle CustomRules="overflow: hidden;" />
<AlternatingRowStyle CustomRules="overflow: hidden;" />

However in my test, using the latest build of WebGrid 7, WebGrid 7 build 403, the style is already added in Firefox and will not cause such issue. Please try updating you control to the latest build.

Hi Glenn,

Thanks for your reply. I had the above already set. These changes did not make a difference. I have the Web Grids DefaultStyleMode="Elegant" but did not have the set UseDefaultStyle=true. This caused this overlapping of text in the WebGrid in firefox. Once I set this setting, the Grid performed correctly.

Thanks,

Dermot

Under such condition, UseDefaultStyle = false, you will need to overwrite the default css style by using the RowStyle and AlternatingRowStyle property. Here is the WebGrid snippet:

<RowStyle CssClass="CustomRow" />
<AlternatingRowStyle CssClass="CustomRow" />

The css class snippet:

<style type="text/css">
    .CustomRow
    {
        overflow: hidden !important;
    }
</style>