"Don't Allow" and "Allow" buttons always off-screen on WP7 Facebook OAUTH browser control

I've developed a WP7 client that uses the Facebook C# SDK, using OAUTH and the web browser control.

Everything works fine except that on the page where the user is requested to accept/reject the access permissions I am asking for, the "Don't Allow" and "Allow" buttons are off the bottom of the browser's screen, and it isn't obvious that the user must scroll down to click on them.

I've tried using all the different display modes (touch, wap, page, popup) and "page" is the only one that shows the buttons on the same page, but then the fonts are tiny. I've also tried different sizes for the browser control.

The example in th开发者_开发问答e SDK has the same behavior.

Has anyone found a work-around for this?

---

The solution I have found is to use Javascript to change the CSS properties for the element:

private void FacebookLoginBrowser_Navigated(object sender, System.Windows.Navigation.NavigationEventArgs e)
{
        // check for when this approve page has been navigated to
        if (FacebookLoginBrowser.Source.AbsolutePath == "/connect/uiserver.php")
        {
            showBrowser();
            // do the script injection on the LoadCompleted event - doing it here will appear to work when you have a fast connection, but almost certainly fails over 3G because the elements aren't ready in time to be modified
            FacebookLoginBrowser.LoadCompleted += new System.Windows.Navigation.LoadCompletedEventHandler(FacebookLoginBrowser_LoadCompleted);
        }
        // etc ...
}

        void FacebookLoginBrowser_LoadCompleted(object sender, System.Windows.Navigation.NavigationEventArgs e)
{
    FacebookLoginBrowser.LoadCompleted -= FacebookLoginBrowser_LoadCompleted;
    // Facebook will likely change this and break our code soon, so make sure you  anticipates this
    try
    {
        FacebookLoginBrowser.InvokeScript("eval", "document.getElementById('platform_dialog_bottom_bar').style.position = 'relative';document.getElementById('platform_dialog_bottom_bar').style.top = '-60px';");
    }
    catch
    {
        // TODO: display instruction to scroll down if we ever end up here
    }
}

I hope that helps. Feel free to contact me if you run into problems

---

I haven't tried this, but could you use the WebBrowser control's Scale(SizeF) method to change the zoom level of the page?