Xamarin.Forms WebView not rendering position: fixed css correctly?

I am trying to create a cross platform app in Xamarin using Xamarin Forms that just crawls my site. Most of the stuff works pretty well, but I ran into a big problem on Android. I made a test Xamarin app that doesn't use Xamarin Forms, just the native Android stuff that Xamarin offers to test if it's Forms only problem. It turns out it looks like ...

The problem is that the Xamarin Forms WebView renders the css for "position: fixed" VERY wrong, while underneath the "native" Xamarin Andoid app everything is rendered as expected.

Now, as I understand it, Xamarin Forms should use the same basic html rendering as the "native" html rendering of applications, which I presented as Chromium under Android 4.4 and up.

Isn't that so? Is this a known bug? Or is it just a setup issue on my side?


Below are images to illustrate the error. As you can see, the large blue bar on the right is not displayed correctly.

enter image description here

This is the test HTML that applications render to illustrate the error:

<!DOCTYPE html>
<html>
<head>
</head>
<body>
    <div style="background: blue; height:100px; width: 100%; position:fixed; left: 0; top: 0;">
        <div style="margin:0 auto; width: 200px;">
            <p style="color: white;">HELLO WORLD</p>
        </div>
    </div>
</body>

      


Any help on this would be GREAT appreciated!
Thanks,
Bas

+3


source to share


1 answer


The problem is not html. Add the height to the WebView or put it in the Grid row.



https://developer.xamarin.com/guides/xamarin-forms/user-interface/webview/

+1


source







All Articles