radhtmlplaceholder adding "extra height" to html page

[Joel Kane]

I've created a Silverlight application with a RadHtmlPlaceHolder and a button which toggles the visibility of the RadHtmlPlaceHolder. When the RadHtmlPlaceHolder is visible, the whole html page seems to increase its height and a vertical scroll bar appears on the browser window, even though all the html content (and silverlight content) fits within the browser window. When the RadHtmlPlaceHolder is invisible, the scroll bar goes away. This issue occurs with IE7 but doesn't occur with Firefox 3.

The code I used is shown below. I've also attached a screenshot of the issue.

<UserControl x:Class="SilverlightApplication1.MainPage"              xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"              xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"              xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls" <Grid x:Name="LayoutRoot">     <Grid.RowDefinitions>         <RowDefinition Height="2*" />         <RowDefinition Height="8*"/>     </Grid.RowDefinitions>     <Button Grid.Row="0" Content="Show / Hide" Click="Button_Click" />     <telerik:RadHtmlPlaceholder x:Name="RadHtmlPlaceholder1" Grid.Row="1" Visibility="Collapsed" /> </Grid> </UserControl>;

using System; using System.Windows; using System.Windows.Controls; namespace SilverlightApplication1 {     public partial class MainPage : UserControl     {         public MainPage()         {             InitializeComponent();             RadHtmlPlaceholder1.SourceUrl = new Uri("http://www.google.com");         }         private void Button_Click(object sender, RoutedEventArgs e)         {             if (RadHtmlPlaceholder1.Visibility == Visibility.Collapsed)             {                 RadHtmlPlaceholder1.Visibility = Visibility.Visible;             }             else             {                 RadHtmlPlaceholder1.Visibility = Visibility.Collapsed;             }         }     } }

Any help would be appreciated.

[Bobi]

Hi Joel Kane,

Thanks for your report - we managed to reproduce the problem. We apologize for the caused inconvenience.
This issue will be added in our todo list and will be fixed as soon as possible. Your Telerik points are updated.


All the best,
Boryana
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Valentin.Stoychev]

Hello Joel Kane,

After research it turned out that this is an issue with the default SL html page template you need to replace the style that is on top of the page:

OLD
==============

<style type="text/css">

html, body {

height: 100%;

overflow:auto;

}

body {

padding: 0;

margin: 0;

}

#silverlightControlHost {

height: 100%;

text-align:center;

}

</style>

===================

 

NEW

===================

<style type="text/css">

html, body {

height: 100%;

}

body {

overflow:auto;

padding: 0;

margin: 0;

}

#silverlightControlHost {

height: 100%;

text-align:center;

}

</style>

====================

Please let us know how it goes!



Regards,
Valentin.Stoychev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

[Phillip Hamlyn]

Hi
I have JUST encountered the same Issue with the added height (whitespace) and scrollbar to an existing "perfect Fit" Screen with a RadHTMLPlaceHolder on it. I have ONLY encountered this since applying the AUG 2010 SP1 for 2010 Q2 release. I applied this to overcome the JScript Error with the RadHTMLPlaceHolder.

I have tried the suggestion above to modify the SL HTML page, however this just gives me YET ANOTHER Permanent (yes now I have two) unwanted scrollbar albeit disabled.

attached redacted sampleScreen with additional added whitespace and single unwanted scrollbar

Any suggestions much appreciated

[Kiril Stanoev]

Hello Phillip,

Instead of just deleting the overflow attribute, try setting it to hidden:

<style type="text/css">
    html, body
    {
        height: 100%;
        overflow: hidden;
    }
    body
    {
        padding: 0;
        margin: 0;
    }
    #silverlightControlHost
    {
        height: 100%;
        text-align: center;
    }
</style>

I'm attaching my sample project. Have a look at it and let me know if it helps.

All the best,
Kiril Stanoev
the Telerik team

[Phillip Hamlyn]

Thanks that did the trick, and will suffice as a workaround for now.
ultimately we have turned off the Browser scrollbar forever, which is acceptable in my current circumstances. As the "issue" only ocurrs since SP1 for 2010 Q2  is there a chance of identification and permanent resolution ?

Thanks once again for the excellent response !

[Miro Miroslavov]

Hello Phillip Hamlyn,

 We did a little change in the HtmlPlaceHolder regarding RightToLeft support, but this shouldn't affect the Browser's scrollbar. We will investigate it, but I think the problem could be more in the Browser, Html, Silverlight bridge and the way they report and handle sizing.

Sincerely yours,
Miro Miroslavov
the Telerik team